Tomato

I think that tomato is the best named CSS color.

AAA

When combined with black, tomato is accessible. It results in a AAA score and the contrast ratio is 7.1.

F

When combined with white, tomato isn't accessible. It results in an F score and the contrast ratio is 2.9. At first this might seem like a bummer, but we can still use it for accents like borders.

In hexadecimal format, tomato is represented as #FF6347.

hsl

In hsl format, tomato is represented as hsl(9.1, 100%, 63.9%).

rgb

In rgb format, tomato is represented as rgb(255, 99, 71).

🍅

There's an emoji for tomato.

{}

You can create a CSS class for tomato.

.tomato {
  color: tomato;
}

🥬

Tomato is technically a fruit, but is often mistaken for a vegetable. This makes it twice as healthy for you.

You can combine tomato with another named color, bisque to make a tasty treat.

Together, they make the tastiest named color gradient possible.

!

You can make everything tomato if you want.

* {
  color: tomato !important;
  background-color: tomato !important;
}

What's your favorite named color?

Let me know on Twitter!


If you want to actually learn about colors, and not read my tomfoolery, I suggest reading The Secret Lives of Color by Kassia St. Clair.