Magnetic Pull Button
Warm EditorialA charcoal pill that gets pulled toward the cursor within a 90px field, its label lagging a bit further behind for a layered parallax.
Buttons are where people touch your site. These micro-interactions press, stretch and bounce like real objects, and each one is accessible and keyboard friendly.
A charcoal pill that gets pulled toward the cursor within a 90px field, its label lagging a bit further behind for a layered parallax.
A neo-print button with a hard offset shadow that physically presses down into the page on tap, then springs back.
A destructive-action button that must be held for 1.2 seconds; a terracotta fill sweeps across, and releasing early rewinds it on a spring.
A compact copy button whose icon morphs into a drawn checkmark while the pill widens to reveal 'Copied' — layout-animated, no layout jump.
A heart button that pops with an overshoot and scatters small paper-cut squares and circles in terracotta, cobalt and charcoal.
A settings toggle whose knob stretches like taffy while traveling and settles with a bounce; the track ink-fills to cobalt.
Rounded 90s buttons with black outlines; hovering wiggles the squiggle decoration and pressing pops dots out of the button.
Puffy pastel clay buttons with inner highlights that deflate when pressed and re-inflate with a wobble.
An 8-bit 'PRESS START' screen: a blinking pixel prompt, a chunky stepped button that drops a pixel and a coin counter that ticks up.
A free library of full website designs. Every design runs live in your browser and comes with a detailed prompt you can paste into Claude to build it. Single UI components live separately, in the components lab.
Open any design, press “Copy Claude Prompt” and paste it into Claude. You get a complete React component with Tailwind CSS and Framer Motion that you can drop into a Next.js site.
Yes. All designs and code are free to use in personal and commercial projects under the MIT license.
Start from a clear design language instead of defaults: a deliberate typeface pairing, a strict palette with one accent, and motion with real spring physics. Every prompt here spells those choices out.
28 design languages, including Neo-Brutalist, Bauhaus, Swiss, Japanese Minimal, Luxury Noir, Retro 70s, Memphis, Y2K, Claymorphism, Risograph, Art Deco and 8-bit.
Yes. Use the brief form on the homepage and you will get a reply within one working day.