Tomato

HEX: #FF6347 | Modern Palette

On White
2.95:1
FAIL
On Black
7.13:1
PASS

Color Specifications

HEX
#FF6347
RGB
255, 99, 71
HSL
9°, 100% ,63%
CMYK
0, 61, 72, 0

About Tomato

Tomato (#FF6347) is a color with RGB(255, 99, 71) and HSL(9.1°, 100%, 63.9%). It is commonly associated with Energetic, Bold moods. In design, it fits Vivid, Neon styles and is suitable for Text, Button, Accent. Its complementary color is #47E3FF, which creates strong contrast. Its triadic palette includes #47FF63 and #6347FF. The name comes from tomate (Spanish).

  • HEX: #FF6347
  • RGB: 255, 99, 71
  • HSL: 9.1°, 100%, 63.9%
  • Mood: Energetic, Bold
  • Style: Vivid, Neon
  • Use case: Text, Button, Accent
  • Complementary color: #47E3FF
  • Triadic colors: #47FF63, #6347FF
  • The name comes from tomate (Spanish).

Live Components

LIGHT
DARK
System Notification Box

Color Palettes

Monochromatic Five tones of the same hue — a reliable scale for backgrounds, surfaces, and text.
Neutral + Accent Four near-neutral tones grounded by a saturated accent — clean and versatile for UI.
Analogous Five hues drifting across a 60° arc — naturally harmonious and pleasing to the eye.
3 + 1 + 1 Three analogous base colors, one complementary accent, one dark anchor — bold yet balanced.

Color Harmonies

Complementary

The color directly opposite on the color wheel — creates maximum contrast and vibrance.

Analogous

Colors adjacent on the wheel — naturally harmonious and pleasing to the eye.

Triadic

Three colors equally spaced 120° apart — bold, balanced, and visually rich.

Split-Complementary

Two colors flanking the complement — high contrast with less tension than full complementary.

Tetradic (Square)

Four colors at 90° intervals — rich variety, best when one color dominates.

Monochromatic

Shades and tints of the same hue — cohesive, elegant, and easy to work with.

Shades & Tints

A seamless scale of #FF6347 from deepest shade to lightest tint.

Color Characteristics

Style
Vivid Neon
Use case
Text Button Accent

Accessibility Simulation

Deuteranopia #A6A63B
Protanopia #818149
Tritanopia #FF6060
Achromatopsia #969696

Frequently Asked Questions

Tomato (#FF6347) is a color with RGB(255, 99, 71) and HSL(9.1°, 100%, 63.9%).

#FF6347 pairs strongly with #47E3FF as its complementary color. It can also be used with neutral tones for balanced UI and design layouts.

#FF6347 is suitable for Text, Button, Accent and works well with Vivid, Neon styles.

#FF6347 is commonly associated with Energetic, Bold.

The name Tomato is linked to tomate from Spanish, meaning The word 'tomato' derives from the Spanish 'tomate', which in turn came from the Nahuatl word 'tomatl'..

Name, History & Etymology

Origin Word tomate
Meaning The word 'tomato' derives from the Spanish 'tomate', which in turn came from the Nahuatl word 'tomatl'.
Language Spanish
First Recorded Use Late 16th Century

History

Tomatoes originated in the Andes region of South America and were cultivated by indigenous peoples for centuries before European contact. Spanish conquistadors introduced tomatoes to Europe in the 16th century, where they were initially viewed with suspicion and often considered ornamental or poisonous. Over time, their culinary value was recognized, leading to widespread cultivation and consumption, particularly in Italian cuisine. The color name 'tomato' directly references the vibrant red hue of a ripe tomato fruit.

First Recorded Use

The first recorded use of 'tomato' in English dates to 1596, referring to the fruit itself, not specifically a color. The color name 'tomato' for a specific shade of red is a much more recent development, likely emerging with the standardization of color names in the 20th century.

Cultural Associations

The color 'tomato' evokes the ripeness and succulence of the fruit, often associated with Mediterranean cuisine and healthy eating. It is a warm, inviting red, distinct from more aggressive or primary reds, suggesting natural abundance. In digital contexts, 'tomato' is a recognized web color, contributing to its modern cultural presence.

Similar Named Colors

Outrageous Orange #FF6E4A ΔE 2.63
Portland Orange #FF5A36 ΔE 2.72
Bittersweet #FE6F5E ΔE 4.17
Sunset Orange #FD5E53 ΔE 4.21

Code Snippets

/* Background */
.element {
    background-color: #FF6347;
}

/* Text */
.element {
    color: #FF6347;
}

/* Border */
.element {
    border: 1px solid #FF6347;
}

/* Linear gradient to complementary */
.element {
    background: linear-gradient(
        to right,
        #FF6347,
        #47E3FF
    );
}

/* Radial gradient */
.element {
    background: radial-gradient(
        circle,
        #FF6347,
        #47E3FF
    );
}

// SCSS variable
$tomato: #FF6347;

// With RGB channels (useful for rgba() usage)
$tomato-r: 255;
$tomato-g: 99;
$tomato-b: 71;

// Usage
.element {
    background-color: $tomato;
    color: rgba($tomato-r, $tomato-g, $tomato-b, 0.8);
}