1 slot open this monthBy the makers of shadcnregistryWe built shadcnregistry. Now we build your product.Book a callCheck availability
1 slot open this monthAI features?We build AI features into your product.Book a callCheck availability
1 slot open this month๐Ÿšจ Slop police๐Ÿšจ Slop police: we clean up vibe-coded apps.Report itReport your app
shadcnregistry
shadcnregistry
RegistryHealthInspect
Terms of ServicePrivacy Policy
  1. Registries
  2. motiq
  3. Border Beam Panel

Border Beam Panel

component

A panel with twin comets orbiting a 2px border ring built from a rotating conic gradient cut by a two-layer CSS alpha mask (never an SVG luminance mask). The angular velocity itself is sprung (k=30, d=11), winding to 240 deg/s on hover and coasting back to 42 deg/s, with an optional coral signature comet 180 degrees opposed. One custom property per frame; content never repaints.

pnpm dlx shadcn@latest add "https://motiq.dev/r/border-beam-panel.json"
Premium blocks for shadcn/uiShadcnblocks.com ยท AffiliateExplore
  • utils
  • primitives
components/motiq/border-beam-panel.tsx