Design Tools
Tools for working with color. Convert between color formats, pick colors from images, generate shades and tints, and fine-tune your palette.
Color Lightener & Darkener
Generate tints and shades of any color. Click any swatch to copy its HEX, RGB, or HSL code.
Color Code Converter
Convert colors between HEX, RGB, RGBA, HSL, HSLA, and CSS named colors instantly.
Tailwind Shade Generator
Generate a full 11-stop Tailwind CSS color scale from any base color. Export as a JS object or CSS variables.
Border Radius Generator
Visually build CSS border-radius values. Control each corner independently, toggle px or %, and copy the ready-to-use shorthand.
CSS Button Generator
Design a custom button with color, padding, font, border, and shadow controls. Get the CSS and HTML output instantly.
CSS Gradient Generator
Build linear, radial, and conic CSS gradients visually. Add color stops, adjust angles, and copy the ready-to-use CSS.
CSS Box Shadow Generator
Generate CSS box shadows with live preview. Stack multiple shadow layers and copy the final box-shadow value.
Color Palette Generator
Generate beautiful color palettes from a base color. Export as CSS variables, Tailwind config, or plain HEX list.
Contrast Checker (WCAG)
Check the contrast ratio between two colors against WCAG AA and AAA accessibility standards.