Shine Border

Docs

Shine Border

Shine border is an animated background border effect.

Enter your credentials to access your account

Installation

Enter your credentials to access your account

import { ShineBorder } from "@/registry/magicui/shine-border";

<div className="relative overflow-hidden">
  <ShineBorder />
</div>

Prop	Type	Default	Description
`className`	`string`	`-`	The class name to be applied to the component.
`duration`	`number`	`14`	Defines the animation duration to be applied on the shining border.
`shineColor`	`string \| string[]`	`"#000000"`	Color of the border, can be a single color or an array of colors.
`borderWidth`	`number`	`1`	Width of the border in pixels.
`style`	`React.CSSProperties`	`-`	Additional styles to be applied to the component.

Contribute