CSS & Tailwind code snippets library ready to copy: buttons, animations and modern effects for your website.
A library of copy-paste code snippets organised into buttons, animations and CSS effects. Every card shows a live preview of the component running next to the full code, so you see the result before taking it into your project. You can filter by category or search by name and by the code itself, and the active filter is stored in the URL so it can be shared.
No screenshots or stale docs: what you see in the preview is exactly what you copy. The code uses plain HTML and CSS or Tailwind classes, with no external libraries adding weight to your bundle. And since copying is one click, dropping in an effect takes seconds instead of minutes.
Giving personality to a call-to-action button, adding a glow hover to landing page cards, solving a loader while a form submits, or getting unstuck when you know the effect you want but can't recall the exact CSS property. It's also a good way to learn animation by reading short, focused code.
Tune durations and easing curves to your interface: under 150 ms an animation goes unnoticed, over 400 ms it feels sluggish. Respect the prefers-reduced-motion setting for people who turn motion off. And map snippet colours to your design tokens instead of leaving hardcoded values.
Yes. They're free to copy, modify and ship in personal or client work with no attribution required.
No. They're built with plain HTML and CSS or Tailwind utilities, with no extra dependencies.
Yes. The markup is generic, so you only need to adapt class or attribute syntax to your framework.
Yes. The filter is kept in the URL, so you can share a direct link to buttons, animations or CSS effects.
Yes, the library grows regularly with new effects and components.