Hex to RGB Converter
Convert between hex, RGB, and HSL with contrast checking.
Contrast Checker
This tool is for informational and educational purposes only. It is not a substitute for professional financial, medical, legal, or engineering advice. See Terms of Service.
Can't find what you need?
Request a ToolHow to Use the Color Converter
This tool lets you convert colors between hex, RGB, and HSL formats instantly. All conversions happen in your browser with no data sent to any server.
- Enter a hex color. Type a hex code like #0B7285 into the hex input field. The RGB and HSL values update automatically as you type.
- Or enter RGB values. Type red, green, and blue values (each 0 to 255) into the RGB fields. The hex and HSL fields update to match.
- Or enter HSL values. Type hue (0 to 360), saturation (0 to 100), and lightness (0 to 100). The hex and RGB fields sync in real time.
- Copy and use. Copy the CSS color values in any format using the Copy buttons. Use the Share button to generate a link with your color pre-filled.
The contrast checker below the color preview lets you test two colors against WCAG accessibility standards. Enter a text color and background color to see whether the combination meets AA or AAA requirements for normal and large text.
About Color Formats
Hex colors use a six-character code to represent red, green, and blue channels in base-16 notation. For example, #FF0000 is pure red. Hex is the most common format in CSS and design tools because it is compact and easy to copy.
RGB (Red, Green, Blue) defines colors using three decimal values from 0 to 255. It maps directly to how screens display color by mixing light from red, green, and blue subpixels. RGB is useful when you need to adjust individual channels or work with JavaScript canvas operations.
HSL (Hue, Saturation, Lightness) describes colors in a way that matches human perception. Hue is the color angle on the color wheel (0 is red, 120 is green, 240 is blue). Saturation controls intensity, and lightness controls brightness. HSL is often the best choice when you need to create color variations, since you can adjust lightness or saturation without changing the base hue.
Frequently Asked Questions
What is the difference between hex and RGB?
Hex and RGB represent the same information in different formats. A hex color like #0B7285 encodes three values (red=0B, green=72, blue=85) in base-16, while RGB uses the same values in decimal: rgb(11, 114, 133). They produce identical colors. Hex is more common in CSS stylesheets, while RGB is used more often in JavaScript and image processing code.
What is HSL?
HSL stands for Hue, Saturation, and Lightness. Hue is the color itself, measured in degrees on a color wheel (0 to 360). Saturation is how vivid the color is (0% is gray, 100% is fully saturated). Lightness is how bright or dark the color is (0% is black, 100% is white, 50% is the pure color). HSL is considered more intuitive than hex or RGB because you can easily create lighter, darker, or muted versions of a color by adjusting one value.
What is WCAG contrast?
WCAG (Web Content Accessibility Guidelines) defines minimum contrast ratios between text and its background to ensure readability. The ratio ranges from 1:1 (no contrast) to 21:1 (black on white). For normal-sized text, WCAG AA requires at least 4.5:1 and AAA requires 7:1. For large text (18px bold or 24px regular), AA requires 3:1 and AAA requires 4.5:1. Meeting these standards helps people with low vision or color deficiencies read your content.
Can I use this for CSS?
Yes. The CSS output section shows ready-to-use CSS declarations in all three formats. Click the Copy button next to any format to copy the full declaration (for example, "color: #0B7285;") to your clipboard. You can also click Copy All to get all three formats at once. Modern browsers support hex, rgb(), and hsl() in any CSS property that accepts a color value.