02 · Vibe Coding
Files your agent
pastes and runs
Everything in this room is a working artifact, not a screenshot of one: a single React file, a canvas effect, a three.js scene. Every preview below runs the exact file you copy. Filter by the screen you are building, open the entry, paste it into the AI chat you already use.
one browser, three kinds of artifact · every preview is live
Add to Cart Fly
ReactThe product tile arcs from the card into the cart glyph, and the badge ticks over on arrival.
Aurora Curtain
webglRays that arrive where a sampled sheet folds end-on, so no line of code decides where a ray belongs.
Biometric Prompt
ReactA fingerprint glyph strokes itself in while the device reads, then a ring settles once it accepts.
Carousel Slide Advance
ReactSlides advance with the neighbours peeking, dots tracking position.
Confetti Burst
particlesOne popper, fired once: a tapered cone of paper with real gravity and tumble.
Expandable Detail Card
ReactA compact card that expands in place into a detail view — image and title travel continuously.
Agent Step Timeline
ReactEach finished stage of an agent run ticks over and grows its connector toward the one after it.
Aurora Veil
particlesCurtains of light that fold, throwing bright vertical rays as they turn.
Bottom Sheet Present
ReactA sheet rises from the bottom edge over a dimming backdrop and settles once.
Cart Drawer Open
ReactThe cart panel travels in from the edge and its line items arrive a beat behind it.
Delete Confirm Morph
ReactA delete control widens in place into a question with a way out, instead of opening a dialog.
Field Reorder Drag
ReactA row lifts onto a shadow while the rows around it part to make room — by pointer, and by arrow key from a grabbed state.
AI Thinking Pulse
ReactA calm breathing dot with a soft expanding ring — the app is thinking, not stuck.
Badge Unlock
ReactAn earned badge lands and one band of light crosses its face — a single pass, then still.
Campfire Embers
particlesA fire's convection column: quick up the middle, drawn in at the base, tumbling at the edges.
Command Palette Open
ReactThe palette drops a short distance into place with its results already filtering as it lands.
Destructive Hold to Confirm
ReactHolding fills the control at an honest rate; letting go early drains it back several times faster.
Gallery Lightbox Open
ReactThe pressed thumbnail flies out of the grid into the large view while the backdrop dims behind it.