Standalone: Components & Blocks

Animated React Components and Blocks

Standalone React components and blocks, built with Tailwind CSS and Motion. Each one installs with the shadcn CLI and ships a remix prompt for any AI tool.

Premium

Agent Feedback Loop

An isometric widget of six AI agent stages in a loop. Hover or tap one to lift it apart.

View Component

Premium

Agent Cost Flow

What one orchestrated agent run cost, drawn end to end: 178 source strands bundle into a spine, five subagent lanes read in parallel, and every band narrows from what that lane read to what it cost, so the small model that did the bulk reading lands as a sliver beside the expensive one that only judged.

View Component

Premium

AI Knowledge Map

A dotted AI orb sits above a confidence indicator and wires to five scored category cards. Clicking one fans its results out along a curved arc.

View Component

Free

Magnetic Logo Cluster

An interactive swarm of your logo. Marks fly in from off-screen, drift endlessly, and bend toward the cursor.

View Component

Premium

Fluid Simulation Hero

A full bleed hero on a real time WebGL fluid simulation. The surface blooms into being on load, and the pointer stirs the dye.

View Component

Free

Diamond Grid

A faint canvas grid of diamonds. Seeded sparks send light outward until fronts meet.

View Component

Free

Scroll Wipe Gallery

A full-bleed, scroll-driven photo gallery. Each photo wipes in from a different edge.

View Component

Premium

Perspective Showcase Hero

A hero section pairing a split editorial header with an endless CSS 3D carousel, no WebGL: cards tilt continuously with distance from the centre so the row reads as one arc, images counter-zoom inside their frames, and one velocity loop drives drift, drag, wheel, and keyboard input. Fully configurable via typed props.

View Component

Premium

Curved Frame Carousel

A fixed frame masks a drifting photo deck. Drag it and panels hinge into 3D at the edge.

View Component

Premium

3D Gem Pricing Section

Three pricing cards, each topped by a still faceted gem that grows and spins on hover.

View Component

Premium

Filter Menu

A skeuomorphic pill that expands into a multi-select filter checklist with Apply.

View Component

Free

Expanding Tabs

A monochrome tab bar of icon circles. Click one and it expands into a labeled pill.

View Component

Free

Delete Button

A red button that starts a five-second delete countdown, with a one-tap undo.

View Component

Premium

3D Product Card

An e-commerce product card with a real WebGL turntable. At rest it's a normal shop card (product, name, price, add-to-cart); hovering tilts the card into a 3D display floor while the product lifts and spins so shoppers can inspect it from any angle. Drag to orbit, pick a finish swatch to recolor the upholstery live, drop in your own .glb, adapts to light and dark themes.

View Component

Free

Mood Tracker

A feelings check-in card with six expressive faces. Drag the segmented slider and the face, label, and liquid color wash shift with your mood.

View Component

Free

Crypto Swap

A crypto token-swap widget with live exchange rates, price impact, and an animated swap button.

View Component

Free

Interactive Card Stack

A scattered stack of photo cards. Drag, click, or arrow keys to focus any card.

View Component

Free

Product Card Deck

A draggable card deck you flick through one card at a time. The top card leans toward your drag, then spins away with momentum to reveal the next, and the deck loops endlessly. Every card pairs a picture with a title and a pill action button with hover and press states.

View Component

Free

Tilted Coverflow

3D coverflow card carousel of seven tilted photos. Drag or arrows to focus any card.

View Component

Free

Cube Carousel

An interactive 3D photo cube with six placeholder images on its faces. Drag with your cursor to spin it freely on both axes; release and it coasts naturally to a stop. No buttons, no snap, no controls, just the cube and your hand.

View Component

Free

Curious AI

A morphing 3D AI orb in Three.js with cyan and magenta rim lights, iridescent pink speckles on a wrinkled surface, and glowing pink robot-eye pills that follow your cursor and blink between idle looks.

View Component

Free

Signature Pad

A signature pad widget: pill button morphs into a canvas to draw with mouse or touch.

View Component

Free

Upload Progress

A collapsible file upload widget with a shimmer progress bar (indigo while uploading, amber on pause). Expand to see per-file rows with live progress, time remaining, and pause, resume, refresh, and stop controls.

View Component

Free

New Project Modal

A pill button that morphs into a soft-UI project creation form: title, description, 7-swatch color label picker, Private toggle, and a checkmark-confirm Create button.

View Component

Free

Live Session Pill

A compact live-session presence pill with an animated speaking indicator and overlapping avatars. Clicks open a soft-UI modal showing all participants with a Join Now button.

View Component

Free

Radial Cards

Seven health-metric cards bloom into a slowly rotating flower. Tap any petal to pull it forward and read your stats up close.

View Component

Free

Slice Type

A typographic magic trick. At rest you read one ambiguous word; hover and it splits into two: LIGHT lifting up, NIGHT sinking down, the shared letters resolving into separate glyphs.

View Component

Free

Ripple Type

SVG text animation warped by a turbulence filter. Toggle the fan and letters ripple.

View Component

Free

Halo Type

Rotating 3D ring text animation: the front arc reads upright, the back arc upside-down.

View Component

Free

Stack Tower

A column of 12 stacked words that reads as a rotating 3D cylinder. 2D transforms skew, scale and shift each row so the rotation travels down the stack. Hover lights one row in warm orange without breaking the rhythm.

View Component

Free

Wild Morph

Italic SVG word that warps under the cursor, a spring-physics text animation.

View Component

Free

Orbit

Kinetic text animation arranged in a circle. Hover slows the spin; letters push outward.

View Component

Free

Playful

Kinetic typography where letters jump, drop, and rotate on cursor proximity.

View Component

Free

Good Vibes

Interactive typography where letters scale 2x and become bold on hover.

View Component

Free

Responsive Letters

Interactive text where each letter responds to cursor proximity, animating variable font properties (weight, stretch, italic, letter-spacing, skew) to create a deformation-under-pressure effect.

View Component

Free

Emoji Reaction Jar

Glass jar widget. Click a reaction to spring the lid and watch the emoji bounce down.

View Component

Free

Sticker Wall

A draggable sticker card wall. Drop notes, toss emoji, pile them up with real 2D physics.

View Component

Free

Peel to Scan

A portrait card whose corner peels on tap, revealing a scannable Wi-Fi QR code.

View Component

Free

Danger Stripes

Three crossing caution-tape stripes on orange. Hover to shake, click to intensify.

View Component

Free

AI Job Cards

Three AI job card stacks with swipe-to-cycle. Brand logos, bookmark toggle, springs.

View Component

Free

Task Cards

A swipeable project task card stack where each card has a unique accent colour, status badge, and due date. Drag left or right to cycle through tasks. The dismissed card springs back to the bottom of the deck.

View Component

Free

Slide Deck

Swipeable card deck with four editorial slides. Navigate forward and back by drag or tap.

View Component

Free

Label Cards

Colour-blocked label cards scattered at random angles. Tap one to spring it to centre.

View Component

Free

Meet the Crew

A swipeable portrait card stack perfect for introducing a team, showcasing crew members, or picking an avatar. Four stacked cards fan out with soft rotations: drag to browse, tap to choose. Drop in your own photos and names for an About Us section, a character selector, or an onboarding profile picker.

View Component

Free

Travel Deck

A swipeable deck of destination cards. Drag the front card down to fling it off-screen and reveal the next. Each card reveals an animated hotels counter as it comes forward.

View Component

Free

Wave Lines

An animated line background. Dense vertical lines ripple with two layered sine waves, bunching and breathing. Hover to send waves across the canvas.

View Component

Free

Distortion Grid

An animated grid background. Thin lines undulate in slow sweeping waves, and hovering repels the grid fabric outward from your cursor.

View Component

Free

Glass AI Composer

Glassmorphism AI chat input with image upload, web search toggle, and model switcher.

View Component

40 more components