Turn taste into numbers you can defend.
Color, contrast, type, gradients, and favicons. The small tools designers and front-end developers reach for every week.
Design Tools
9 tools
Generators
Graduo
CSS gradients with Tailwind output and OKLCH color quality.
Try it OKLCH interpolationTypeDuo
Font pairings that explain themselves.
Try it lock slots, reshuffle restFavset
Your favicon set, dark-mode ready, in 90 seconds.
Try it dark-mode variantsHexroot
Drop an image, paste a :root.
Try it 3-12 colorsShadl
Hit space. Get colors that actually pass.
Try it WCAG + APCA scoredGradText
CSS text gradients with real fonts and real color science.
Try it 30+ Google FontsPick the tool by the task
Check one color pair for contrastRatiaWCAG 2.2 and APCA together; walks failing colors to a passBuild a palette from scratchShadlspacebar palettes, WCAG AA/AAA + APCA scored, Tailwind v4 exportPull a palette out of an imageHexroot3-12 colors: :root block, Tailwind, JSON tokens, WCAG matrixSet a background gradientGraduoOKLCH interpolation, so the middle never goes greyPut a gradient on headline textGradText60 fonts plus the full background-clip: text snippetConvert between color formatsHextlyHEX, RGB, HSL, CMYK live, round-trip accurate, session historyPair a heading face with a body faceTypeDuoreasoned pairings, x-heights within 4%, previewed at body sizeShip the favicon setFavsetdark-mode SVG, iOS touch icon, manifest, fallback ICOCheck a photo's compositionCompovfour overlay guides, non-destructive, full-resolution download
The dead-zone proof
sRGB: what most free tools output
OKLCH: what the browser can already do
Same endpoints. sRGB interpolation greys out in the middle; OKLCH stays saturated.
See all 51 tools.