Developer Tool
    Free Forever

    Free Color Picker

    Pick any color and instantly convert between HEX, RGB, HSL, and CMYK. View shades, light/dark previews, and copy any color format with one click.

    Privacy Safe
    Instant Results
    4.9 Rating
    Color Picker
    HEX • RGB • HSL • CMYK converter
    HEX#D97706
    RGBrgb(217, 119, 6)
    HSLhsl(32, 95%, 44%)
    CMYKcmyk(0%, 45%, 97%, 15%)
    CSS Filterbrightness(66%) saturate(114%)
    Preset Colors

    Preview on light background

    Preview on dark background

    Color Shades
    10%50%90%

    Color Formats Explained

    Different design and development contexts use different color formats. Web development primarily uses HEX and RGB. CSS also supports HSL which is great for theme design. Print design requires CMYK. Our color picker converts between all formats instantly.

    How to Use This Tool

    1
    Pick a Color
    Click the color swatch to open the color picker, or type a HEX code directly.
    2
    View Color Formats
    HEX, RGB, HSL, and CMYK values are calculated and displayed automatically.
    3
    Explore Shades
    Click any shade in the gradient strip to set that shade as your color.
    4
    Copy Any Format
    Click the copy icon next to any format to copy that value.

    Frequently Asked Questions

    Take the 6-digit hex code, split into 3 pairs (RR, GG, BB), and convert each from hexadecimal to decimal. Example: #FF6B6B → R=255 (FF), G=107 (6B), B=107 (6B) → rgb(255, 107, 107). Our tool does this instantly.

    HSL stands for Hue, Saturation, Lightness. Hue is the color angle (0–360°), Saturation is color intensity (0–100%), and Lightness is brightness (0% = black, 100% = white, 50% = pure color). HSL is intuitive for designers as it directly maps to how we perceive color.

    CMYK (Cyan, Magenta, Yellow, Key/Black) is used for print design. Screens use RGB (additive), while printers use CMYK (subtractive). Always convert RGB to CMYK when preparing designs for print to avoid unexpected color shifts.

    WCAG 2.1 requires a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text (18pt or 14pt bold) against background colors. Use a contrast checker alongside our color tool to ensure your color combinations are accessible.

    Related Free Tools

    📱
    QR Code Generator
    Generate QR codes
    Aa
    Case Converter
    Text case tools
    📝
    Word Counter
    Count words
    🔐
    Password Generator
    Secure passwords