HesapHanem

Color Name to HEX Converter

Type a CSS color name (e.g. tomato or cornflowerblue) to get its HEX and RGB values.

How it is calculated

This is a lookup, not a calculation. The text you type is lowercased and all spaces are removed, then matched against a built-in table of CSS colour keywords, so "CornflowerBlue", "cornflowerblue" and "Corn Flower Blue" all find the same entry. When a match exists, the tool returns its six-digit hexadecimal code and the same colour as decimal RGB. The hex code is three pairs of base-16 digits for red, green and blue, #RRGGBB, and each pair converts to a decimal value from 0 to 255 with decimal = 16 × first digit + second digit. Both spellings gray and grey are accepted. Anything that is not in the table, such as "transparent", a hex code, or a name from another system, gives no result.

Worked example

Type CornflowerBlue. The tool lowercases it to cornflowerblue and finds #6495ED. Split into pairs: 64, 95 and ED. In decimal, 64 is 6 × 16 + 4 = 100, 95 is 9 × 16 + 5 = 149, and ED is 14 × 16 + 13 = 237. The RGB result is therefore rgb(100, 149, 237), a medium, slightly muted blue. The same code can be pasted into any CSS rule, design tool or drawing library that wants hex values.

Try this example →

Common mistakes

  • Typing a hex code or an RGB value instead of a name. Only colour names are looked up, so "#ff0000" returns nothing.
  • Expecting everyday colour words to work. Names such as "teal" and "salmon" exist, but "transparent", "light red" or "sky" are not CSS keywords, and a space only helps inside a real name ("sky blue" works as skyblue).
  • Assuming a hex code with a letter is case-sensitive. The result is written in capitals, but #6495ed and #6495ED are the same colour in CSS.
  • Mixing up the hex pairs. The order is red, green, blue, so #6495ED has red 100, not blue 100.
  • Expecting a similar "dark" or "light" variant to share a spelling. "darkblue" and "blue" are different keywords with very different codes (#00008B and #0000FF).

About this calculator

The CSS Color Module defines 148 standard named colors — from common ones like tomato to obscure ones like papayawhip and rebeccapurple — each mapped to a fixed hexadecimal RGB value that every browser renders identically. Because these names are just aliases for specific hex codes, converting one to the other is a straightforward lookup rather than a calculation.

This converter takes a CSS color name and returns its HEX and RGB equivalents, so you can drop the exact value into a design tool, a brand style guide, or code that doesn't accept named colors (such as SVG fill attributes in some contexts, or non-CSS graphics libraries). Front-end developers and designers use it when translating a mockup's named colors into CSS custom properties or a canvas/SVG drawing API that expects hex or RGB input.

Was this helpful?

You can pick up to 3 reactions.

Comments (1)

  • Editorial team

    Type rebeccapurple and you get 663399 as the hex value, shown as rgb(102, 51, 153); in CSS you write it with a leading hash sign. That name is one of the newest CSS keywords, so a very old browser or an email client may not recognise it, whereas the hex code works everywhere. Spaces and capitals in the input are ignored. Which colour names have you tried that the table did not know?

Popular calculators

Loan Calculator

Monthly payment, total interest and full amortization schedule.

Percentage Calculator

Percent change, percent of, and ratio calculations.

Discount Calculator

Calculate final price, savings, and discount amount.

BMI Calculator

Body mass index from height and weight (metric or imperial).

Age Calculator

Compute your exact age in years, months and days from a birth date.

Compound Interest Calculator

Calculate the final amount and interest earned with compounding.

All Calculators