HTML Color Converter & Color Codes Chart

HTML color chart

Click a row to open the color in the converter above.

CSS color names

The 148 color names that CSS understands. Click a row to open the color in the converter.

HTML Color Codes, Color Chart and Color Converter

Convert any color between HEX, RGB, HSL and HSV (with transparency), find the HTML code of a color by its name, check how readable text is on top of it and browse a ready-made chart of HTML color codes. Everything is calculated instantly in your browser, nothing is sent to a server.

How to use the color converter

1. Type or paste a color in the field: HEX (#2563EB or 2563EB), rgb(37, 99, 235), hsl(221, 83%, 53%), hsv(221, 84%, 92%) or a CSS color name such as rebeccapurple. Alpha values like #2563EB80 or rgba(37, 99, 235, 0.5) work too.
2. Or choose a color with the color picker next to the field, or click any row of the color tables below.
3. Copy the format you need with the copy button next to it: HEX, HEX alpha, RGB, RGBA, HSL, HSLA, HSV or the CSS color name when there is an exact match.

If the color is in a picture, a photo or on your screen, use the Online Color Picker to pick it and then paste the code here to get it in every format.

HEX, RGB, HSL and HSV: what is the difference?

• HEX (#RRGGBB) is the shortest and most common way to write a color in HTML and CSS. Each pair of digits is the amount of red, green and blue from 00 to FF. An extra pair adds transparency (#RRGGBBAA).
• RGB and RGBA write the same red, green and blue amounts as numbers from 0 to 255, with an optional alpha (opacity) from 0 to 1.
• HSL and HSLA describe a color as hue (0-360 degrees on the color wheel), saturation and lightness. They are the easiest to adjust by hand: change the lightness for a lighter or darker shade, keep the hue for the same color family.
• HSV (also called HSB) uses hue, saturation and value (brightness). It is what most graphic editors and color pickers show.

Text contrast (WCAG)

The converter shows the contrast ratio of the selected color with white and with black text. Web accessibility guidelines (WCAG) ask for at least 4.5:1 for normal text and 3:1 for large text (level AA), and 7:1 and 4.5:1 for the stricter level AAA. Use it to choose a readable text color for a button or a background.

Shades and complementary color

Below the converter you get three lighter and three darker shades of the same hue, and the complementary color from the opposite side of the color wheel. Click any of them to continue working with that color.

HTML color chart

This article presents an extensive HTML color table that serves as a handy cheat sheet for web developers and designers. Here, you will find a list of popular and rare shades with their names in both Russian and English (e.g., "Snow" or "Cornflower"), along with their corresponding HEX codes required for web layout and CSS styling.

The content is structured by color groups, allowing you to quickly select the perfect tone, ranging from classic black and white to specific variations like "Pale Goldenrod" or "Sea Green". Use the search field to find a color by its Russian or English name or by its HEX code.

CSS color names

Besides the HEX codes, CSS understands 148 color names such as tomato, navy or rebeccapurple. You can use them directly in your stylesheet instead of a code, and the second table lists all of them with their HEX values. Names are easier to read, while HEX, RGB and HSL give you every possible color and transparency.