Color Picker
Pick any color and get HEX, RGB, HSL values instantly. Explore shades, tints, and color harmonies.
Color Format Guide
HEX — used in CSS and design tools. A # followed by 6 hex digits representing red, green, blue. RGB — specifies red, green, blue each from 0–255. HSL — Hue (0–360°), Saturation (0–100%), Lightness (0–100%). More intuitive for creating variations. HSV — similar to HSL but uses Value instead of Lightness, common in design software like Photoshop.
What is the difference between HSL and HSV?
Both use Hue and Saturation. HSL uses Lightness where 100% is always white. HSV uses Value where 100% is the pure color at full brightness. HSV is more common in design software; HSL is more common in CSS.
How do I get color harmonies?
Color harmonies are sets of colors that work well together based on their position on the color wheel. Complementary colors are opposite each other (180°). Triadic colors are evenly spaced at 120°. Analogous colors are adjacent (±30°).
What are shades and tints?
Shades are created by adding black to a color (decreasing lightness). Tints are created by adding white (increasing lightness). Both are useful for building design system palettes with consistent steps.