Gradient Border

Rotating conic gradient border using @property CSS animation. Works on any element.

borders intermediate

Gradient border card

The border rotates continuously with a smooth conic gradient.

"use client";

import React from "react";
import { cn } from "@/lib/utils";

interface ComponentProps {
  children: React.ReactNode;
  className?: string;
  variant?: "default" | "primary";
  // ...
}

export function Component({
  children,
  className,
  variant = "default",
  ...props
}: ComponentProps) {
  // Full implementation
  // available with subscription
  return (
    <div className={cn("...", className)}>
      {children}
    </div>
  );
}

Premium Code

Get the complete, production-ready source code for this component.

Sign up free