Free Color Picker
Pick any color and instantly get its HEX, RGB, HSL, and CMYK values with one-click copy. Generate professional color palettes — complementary, analogous, triadic, split-complementary, and monochromatic — all based on your chosen color. Perfect for designers, developers, and anyone who works with color. 100% browser-based.
White text on your color
Preview how text looks on this background
Your color as text
Preview how this color looks as text on white
Frequently Asked Questions
What is the difference between HEX, RGB, and HSL?+
HEX is a base-16 shorthand for RGB, commonly used in web development (e.g., #3b82f6). RGB defines colors by red, green, and blue components (0–255 each). HSL defines colors by hue (0–360°), saturation (0–100%), and lightness (0–100%) — often more intuitive for adjusting colors.
What is a complementary color?+
A complementary color is directly opposite on the color wheel (hue + 180°). Complementary pairs create maximum contrast and are used for call-to-action buttons, highlights, and bold accents.
What is an analogous color palette?+
Analogous colors sit adjacent on the color wheel (±30° and ±60°). They create harmonious, low-contrast palettes that feel natural and cohesive — great for backgrounds, gradients, and calm UI designs.
What are triadic colors?+
Triadic colors are three evenly spaced colors on the wheel (120° apart). They create vibrant, balanced palettes that work well in logos, illustrations, and designs that need variety with visual balance.
What is CMYK used for?+
CMYK (Cyan, Magenta, Yellow, Key/Black) is the color model used in print. If you are designing for physical printing — business cards, brochures, packaging — give your printer CMYK values rather than RGB or HEX to ensure accurate color reproduction.
You might also like
Understanding Color Models
Every digital color can be expressed in multiple models. HEX is a shorthand for RGB in base-16 (e.g., #3b82f6). RGB (Red, Green, Blue) is how screens produce color by mixing light. HSL (Hue, Saturation, Lightness) is more intuitive for human perception — adjust the hue to change color, saturation to make it more/less vivid, and lightness to go lighter or darker. CMYK (Cyan, Magenta, Yellow, Key/Black) is the standard for print.
Choosing a Color Palette for Design
Complementary palettes (opposite colors on the wheel) create the most visual contrast — perfect for call-to-action buttons against a background. Analogous palettes (neighboring colors) feel harmonious and natural — great for backgrounds and gradient systems. Triadic palettes balance three equally-spaced hues — versatile for logos and illustrations. Monochromatic palettes use one hue at different lightness levels — elegant and easy to apply consistently in a UI.