Professional Design Tools
Everything you need to build consistent, accessible user interfaces — color systems, gradients, contrast checking, QR codes, favicons and more. All free, all in your browser.
Color Playground
Most PopularGenerate accessible UI color palettes with real-time preview on desktop and mobile layouts. Export as CSS variables or JSON design tokens.
Site Style Guide Generator
Extract colors, fonts, logos, and spacing from any live website and instantly generate a complete style guide.
Color Converter
Instantly convert between HEX, RGB, HSL, OKLCH, HSV, and CMYK color formats with live preview.
WCAG Contrast Checker
Check foreground/background color contrast ratios against WCAG 2.1 AA and AAA accessibility standards.
Gradient Maker
Build beautiful linear, radial, and conic CSS gradients with live preview and one-click copy.
Palette Extractor
Upload any image and automatically extract a dominant color palette. Export as HEX, CSS variables, or JSON tokens.
QR Code Generator
Create branded QR codes with custom colors, gradients, dot styles, logo embedding, and SVG export.
Favicon Generator
Generate favicon sets in ICO, PNG, and SVG formats from text, emoji, shapes, or uploaded images.
Image Downloader
Extract and download all images from any webpage including backgrounds, srcset, and lazy-loaded images.
Start with the Color Playground
Our flagship tool — generate a full UI color system and see it applied live to real interface components.
Open Color Playground →