What it does
Drop your skills, services or tech stack as pill-shaped tags that fall with gravity, bounce and pile up at the bottom of the frame. Visitors can grab and throw any tag, or just sweep the cursor through the pile to scatter it. Give a tag a link and a quick tap takes people to that project or service page — dragging never triggers the link.
Pick one of three drop styles — Rain, Pour or Burst — and tune gravity, bounce, friction and stagger until it feels right. It is one self-contained file with no physics library, so it stays light, and it goes fully idle once the pile has settled.
Customizable properties
- Tags — label, optional link, "Featured" accent (up to 60 tags)
- Trigger — In View (with optional Replay when scrolled back in) or On Load
- Drop Style — Rain, Pour or Burst
- Physics — gravity, bounce, friction, stagger
- Interaction — Drag & Throw on/off, Cursor Push on/off, links open in same or new tab
- Keep Readable — keeps every tag within a Max Tilt (default 25°) so nothing settles upside-down or vertical; thrown tags spin freely and right themselves on landing
- Colors — any number of fills shared across tags, a Featured color, auto or custom text color
- Shape — border width and color, radius, padding X/Y
- Background — transparent by default (empty space is click-through, so it can sit over footer links)
- Font — full font control
Why this component
- Tags can be links: skills → case studies, services → service pages. Tap opens, drag never does.
- Cursor Push: the pile reacts to the pointer without grabbing — great on hover-heavy portfolio pages.
- Three drop styles instead of one, so the same component fits a calm footer or a playful hero.
- No external physics library, one file — light to load, and the loop stops completely when the pile is at rest.
- Respects the canvas, static export and "reduce motion": you always see the settled pile, never a blank frame.
Need help?
Email hello@brandingupstudio.com — we usually reply within 72 hours. Custom edits are available from $75/hr.
