Named color · #AA251B
Tomato Sunrise
Tomato Sunrise is #AA251B: rgb(170 37 27), hsl(4 73% 39%), oklch(0.484 0.171 29.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Tomato Sunrise color name →
#AA251B
oklch(0.484 0.171 29.3)
Color conversions
- HEX
- #aa251b
- RGB
- rgb(170 37 27)
- HSL
- hsl(4 73% 39%)
- HWB
- hwb(4 11% 33%)
- OKLCH
- oklch(0.484 0.171 29.3)
- OKLab
- oklab(0.484 0.149 0.083)
- CIE Lab
- lab(38.44 53.19 41.02)
- LCH
- lch(38.44 67.17 37.6)
- CMYK
- cmyk(0% 78% 84% 33%)
Tints · Shades · Tones
Tints
- B54134
- C0584A
- CA6D60
- D38276
- DC978C
- E4ACA2
- ECC0B9
- F3D5D0
- F9EAE7
Shades
- 931F16
- 7D1911
- 68130C
- 530D08
- 3F0805
- 2D0402
- 1B0201
- 0B0000
- 010000
Tones
- A83428
- A54034
- A24A3E
- 9E5348
- 9B5B52
- 96635B
- 926B64
- 8D726E
- 877977
Color harmonies
Complementary +180°
- AA251B
Tomato Sunrise
- 006B78
≈ Mary Blue
Analogous -30° +30°
- AA251B
Tomato Sunrise
- A4225C
≈ Vivacious
- 8C4C00
≈ Parasite Brown
Triadic +120° +240°
- AA251B
Tomato Sunrise
- 007230
≈ Clear Green
- 3952BD
≈ Cerulean Blue
Split-complementary +150° +210°
- AA251B
Tomato Sunrise
- 006F60
≈ Falcon Turquoise
- 006595
≈ Wavy Navy
Tetradic +90° +180° +270°
- AA251B
Tomato Sunrise
- 586700
≈ Serrano Pepper
- 006B78
≈ Mary Blue
- 6E3FAF
≈ Shiner
Contrast & accessibility
Ag
AAAOn white
WCAG 7.02:1 · APCA Lc 83
Ag
FailOn black
WCAG 2.98:1 · APCA Lc 19
Best text color: #FFFFFF
WCAG 7.02:1 (AAA) · APCA Lc 83
Contrast pairs
Code snippets
CSS
:root {
--tomato-sunrise: #aa251b;
--tomato-sunrise-rgb: 170 37 27;
--tomato-sunrise-oklch: oklch(0.484 0.171 29.3);
}
.element {
color: var(--tomato-sunrise);
background-color: hsl(4 73% 39%);
border-color: oklch(0.484 0.171 29.3);
}Tailwind CSS v4
@theme {
--color-tomato-sunrise: #aa251b;
--color-tomato-sunrise-50: #ffe4d7;
--color-tomato-sunrise-100: #ffd3c5;
--color-tomato-sunrise-200: #ffb9a7;
--color-tomato-sunrise-300: #ff9480;
--color-tomato-sunrise-400: #f27161;
--color-tomato-sunrise-500: #e14c3c;
--color-tomato-sunrise-600: #be4134;
--color-tomato-sunrise-700: #993429;
--color-tomato-sunrise-800: #72241f;
--color-tomato-sunrise-900: #501814;
--color-tomato-sunrise-950: #350806;
}SCSS
$tomato-sunrise: #aa251b;
$tomato-sunrise-rgb: 170, 37, 27;
$tomato-sunrise-light: mix(#fff, $tomato-sunrise, 20%);
$tomato-sunrise-dark: mix(#000, $tomato-sunrise, 20%);
.element {
color: $tomato-sunrise;
box-shadow: 0 0 0 2px rgba($tomato-sunrise, 0.35);
}