Summer pricing is live: save $50 on Starwind Pro lifetime access.
Starwind Pro
Back to Effect

Effect 4 - Rotating Gradient Border

Free

A card with an animated rotating gradient border effect that creates a dynamic, eye-catching visual element.

Upgrade to Pro

Rotating Gradient Border

Watch as the gradient border continuously rotates around this card, creating a mesmerizing animated effect that draws attention to your content.

Loading code...

Starwind Dependencies

Sign in to view code and copy install commands.

Sign in

This component requires Starwind Pro.

Get lifetime access to all premium components, updates, and priority support.

Upgrade to Pro

Failed to load code. Please try again.

Code

Usage
<Effect4
  border-width={2}
  duration={7}
/>

Props

proptypedefaultdescription
borderWidth number 2 Border width in pixels.
duration number 7 Animation duration in seconds.
colors string[] ["var(--color-blue-500)", "var(--color-violet-500)", "var(--color-pink-500)", "var(--color-emerald-500)"] Gradient color stops used by the rotating border.