BuildUtilities

Color Format Converter – Free Online Tool

Convert colors between HEX, RGB, HSL, and other formats instantly.

✦ FreeNo SignupInstantDesignColor Contrast & AccessibilityColor Theory for Developers
5 formats
HEX
#3b82f6
RGB
rgb(59, 130, 246)
HSL
hsl(217, 91%, 60%)
OKLCH
oklch(0.62 0.188 259.8)
CMYK
cmyk(76%, 47%, 0%, 4%)

Example

Input

#3B82F6

Output

RGB: rgb(59, 130, 246) | HSL: hsl(217, 91%, 60%)

The hex color is converted to RGB and HSL equivalents.

How to Use Color Format Converter

  1. 1

    Enter Color

    Paste a color value in any format (HEX, RGB, or HSL).

  2. 2

    View Conversions

    All format equivalents are shown automatically.

  3. 3

    Copy

    Copy the format you need.

Common Use Cases

  • ✦Converting between CSS color formats
  • ✦Matching colors across design tools and code
  • ✦Extracting color values from designs for development

Embed This Tool

Add this tool to your website or blog with a simple iframe embed.

<div style="max-width:480px"><iframe src="https://buildutilities.com/embed/color-format-converter?ref=embed" width="480" height="360" frameborder="0" style="border-radius:8px;border:1px solid #2a2e3a;width:100%"></iframe><p style="font:11px sans-serif;color:#888;margin:4px 0 0;text-align:right">Powered by <a href="https://buildutilities.com/color-format-converter?ref=embed" target="_blank" rel="noopener">BuildUtilities</a></p></div>

Share

Share a link to this tool. Results can be passed via URL parameters.

https://buildutilities.com/share/color-format-converter

More Design Tools

Tools for accessibility, color, and visual asset generation.

Aa Color Contrast Checker◈ Favicon Generator🎨 Color Palette Generator🌈 Gradient Palette Generator📊 Color Scale Generator👁️ Color Blindness Simulator
View all Design tools
Tip Jar