Star Border
A wrapper with an animated glowing gradient border that travels around the edge.
hoverloopcss
Styled with ONONC's design tokens — shadcn add installs them for you.
Customize
Style
Glow color
Border thickness2px
Corner radius16px
Outer glow14px
Motion
Speed6s
Props
| Prop | Type | Default | Description |
|---|---|---|---|
children* | ReactNode | — | Content wrapped by the animated border. |
color | string | "#8b5cf6" | Glow color (hex). |
speed | number | 6 | Seconds per travel loop. |
thickness | number | 2 | Border thickness in pixels. |
radius | number | 16 | Corner radius in pixels. |
glow | number | 14 | Soft outer glow radius in pixels (0 disables). |
className | string | — | Class applied to the inner content element. |