Styling Tools

Explore a collection of React and Motion-based micro-interactions and transition components designed to enhance your UI with smooth, engaging animations.

Open-source, shadcn-compatible components built on Framer Motion and Tailwind CSS for seamless animations.

Implement seamless squircle corners with bindings for React, Vue, Svelte, and a framework-agnostic core. Customize borders, shadows, and corner control.

Create dynamic, chrome-like effects on buttons and UI components with this WebGL-based animated metal shader, featuring customizable presets and controls.

A lightweight, customizable Atomic CSS engine that delivers instant styles without parsing delays.

Create modern websites with build-time, type-safe CSS-in-JS, supporting RSC, multi-variant styles, and an excellent developer experience.

Generate real CSS files during build with dynamic styles and React bindings, enhancing productivity with source maps and linting.

Generate static CSS files at build time using TypeScript with zero runtime overhead.

Create styled React components with CSS, supporting server/client rendering, streaming SSR, and React Native using a single API.

Tailwind CSS is a utility-first CSS framework packed with classes that can be composed to build any design, directly in your markup.