Tools
Small, focused utilities for building interfaces. Nothing to install and nothing to sign up for — each one runs in your browser and gives you code you can paste straight into a project.
Color & theme
shadcn/ui Theme Generator
Turn one brand color into a complete shadcn/ui theme, in light and dark.
Color & themeTailwind CSS Color Generator
Turn one color into a full Tailwind scale, from 50 to 950.
Color & themeContrast Matrix
Check every shade in your palette against every other one.
Color & themeColor Format Converter
Convert a color between HEX, RGB, HSL and OKLCH.
Color & themeDark Mode Mapper
Derive a dark palette that actually matches your light one.
Color & themeColor Blindness Simulator
See your palette the way roughly 1 in 12 men does.
Color & themeTailwind v3 → v4 Colour Migrator
Turn a v3 colour object into a v4 @theme block.
Color & themePalette from an Image
Pull the dominant colours out of a picture, then build a scale.
Color & themeAnimation & motion
Easing Editor
A curated easing library, previewed on things you actually animate.
Animation & motionKeyframe Generator
The animations you keep rewriting, ready to paste.
Animation & motionScroll Animation Playground
Reveal and progress effects driven by scroll, without JavaScript.
Animation & motionSpring Easing
Tune a spring by feel, export it as CSS or motion config.
Animation & motionMarquee Generator
A logo strip that loops seamlessly and stops when someone looks.
Animation & motionCSS & visual effects
Blob Generator
Soft organic shapes, and the CSS to make them move.
CSS & visual effectsMesh Gradient Generator
Soft multi-colour backgrounds, with grain to kill the banding.
CSS & visual effectsClip Path Editor
Drag the corners, get the polygon.
CSS & visual effectsScrollbar Styler
Style a scrollbar once, for every browser that will listen.
CSS & visual effects