#3b82f6
Pick any color and instantly get its HEX, RGB, HSL, and CMYK values. Generate complementary, triadic, analogous, and split-complementary palettes. Copy any value with one click.
Click the color square to open your browser color picker, or type a HEX code directly into the HEX field. You can also paste any color format (HEX, RGB, HSL) into the quick paste field.
HEX uses a 6-digit hexadecimal code (#3b82f6). RGB defines red, green, and blue channels (0-255 each). HSL uses Hue (0-360°), Saturation (0-100%), and Lightness (0-100%) — more intuitive for designers.
Complementary colors are directly opposite on the color wheel (180° apart). They create maximum contrast and visual tension. Blue and orange, red and green, yellow and violet are classic complementary pairs.
Three colors evenly spaced on the color wheel (120° apart). Triadic palettes are vibrant and high-contrast while still balanced. Example: red, yellow, blue (the primary colors).
CMYK (Cyan, Magenta, Yellow, Black) is used in print design. Printers mix these four inks to create colors. RGB is for screens (light-based), CMYK is for print (ink-based). The same color can look different in each model.
HSL (Hue, Saturation, Lightness) and HSV (Hue, Saturation, Value/Brightness) are both intuitive models. In HSL, 50% lightness is a pure color. In HSV, 100% value is a pure color. HSL is used in CSS; HSV is common in design apps like Photoshop.
Use a light text color (#fff or light HEX) on dark backgrounds and dark text (#000 or dark HEX) on light backgrounds. This tool auto-shows contrasting text on swatches. For WCAG AA compliance, contrast ratio should be at least 4.5:1.