Convert color spaces, create harmonious palettes, test contrast, and simulate color blindness.
Move a colour between HEX, RGB, HSL, HSV, and print systems.
Convert HEX color codes (#RRGGBB, #RGB) to RGB / RGBA values.
Convert RGB / RGBA color values to 6-digit or 8-digit HEX codes.
Convert HEX color codes to Hue, Saturation, and Lightness (HSL).
Convert HSL color values to standardized HEX codes.
Convert RGB colors to Hue, Saturation, and Value (HSV / HSB).
Convert HSV / HSB color values to standard RGB components.
Convert simultaneously across HEX, RGB, RGBA, HSL, HSLA, HSV, CMYK, and HWB formats.
Convert color temperature in Kelvin (1000K - 12000K) to RGB and HEX values.
Validate 3, 6, and 8-digit HEX color codes and normalize formatting.
Look up Pantone and standard spot color equivalents in RGB and HEX format.
Convert classic RAL industrial color numbers to exact HEX and RGB codes.
Choose a colour, or find out what to call one.
Visual color picker showing real-time HEX, RGB, HSL, HSV, and CMYK formats.
Find the closest matching human-readable color name for any HEX or RGB color.
Lookup standard W3C CSS named colors and convert them to HEX, RGB, and HSL.
Generate creative descriptive names, moods, and usage suggestions for any color.
Generate a set of colours that work together.
Generate harmonious 5-color palettes with random or seed-based schemes.
All-in-one generator for complementary, analogous, triadic, split-complementary, and tetradic schemes.
Calculate exact complementary opposite colors on the 360-degree color wheel.
Generate 3-color triadic harmony palettes spaced 120 degrees apart.
Generate 4-color tetradic (rectangular/square) color schemes.
Generate adjacent analogous colors neighboring on the color wheel.
Generate single-hue monochromatic palettes with varying lightness and saturation.
Derive lighter and darker steps from one base colour.
Generate darker shades of any base color with configurable steps.
Generate lighter tints of any base color by mixing with white.
Generate full Material Design 50-900 tint & shade swatches from a primary color.
Check a pairing passes WCAG and works for colour-blind users.
Check WCAG contrast ratio between text and background colors for accessibility compliance.
Comprehensive WCAG 2.1 AA & AAA compliance test for normal text, large text, and UI components.
Simulate how colors appear to Deuteranopia, Protanopia, Tritanopia, and Achromatopsia vision.
Find the closest accessible text color (black, white, or adjusted hue) meeting WCAG AA.
Generate ready-to-paste CSS for gradients, shadows, and glass.
Generate linear and radial CSS gradient code with multiple color stops and angle.
Build a CSS box-shadow value with offset, blur, spread, color, and inset controls, and copy the ready-to-use CSS.
Generate a frosted-glass CSS effect with backdrop blur, translucent background, and border, ready to paste into your stylesheet.
Build a CSS border-radius value with independent per-corner controls, in pixels or percent.
Pull colours out of a file and compare them.
Scan CSS stylesheets and extract a comprehensive palette of all unique color codes.
Simulate and extract dominant color palettes and accents from image data.
Calculate Euclidean and CIE76 Delta E perceptual color distance between two colors.
Generate clean SVG swatch badges and palette cards ready for GitHub READMEs or designs.
WCAG Contrast Ratios Explained: AA vs AAA
What the WCAG contrast ratio numbers mean, how 4.5:1 and 7:1 were chosen, when large text qualifies for 3:1, and how to decide whether you need AA or AAA.
Hex vs RGB: What's the Actual Difference?
Hex vs RGB explained: they encode identical sRGB values in different bases. Here is what actually changes, when each notation wins, and how to convert.
How to Fix Failing Color Contrast on Your Site
A step-by-step process to fix color contrast failures without wrecking your brand palette: triage by impact, shift lightness not hue, and repair tokens at the source.
Why You Shouldn't Rely on Color Alone
WCAG 1.4.1 Use of Color is Level A. Exactly what color alone accessibility forbids, the four places designs break it, and non-color indicators that work.
ToolKitSphere