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. Mask Wipe Sections

Mask Wipe Sections

component

Chaptered storytelling with hard cuts instead of crossfades: each section is revealed by a scroll-driven clip-path wipe - an angled sweep, an expanding iris, or a centre-split curtain - led by a lit accent edge. The iris ring is an SVG circle whose radius animates, so the stroke hugs the clip edge at constant width. Reduced motion collapses the sticky stack into plain stacked sections.

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