Nearest named color · #CC3028
#CC3028
Nearest named color: Hot Lips
#CC3028 (rgb(204 48 40), hsl(3 67% 48%), oklch(0.556 0.194 28.3)) is closest to the named color Hot Lips. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#CC3028
oklch(0.556 0.194 28.3)
Color conversions
- HEX
- #cc3028
- RGB
- rgb(204 48 40)
- HSL
- hsl(3 67% 48%)
- HWB
- hwb(3 16% 20%)
- OKLCH
- oklch(0.556 0.194 28.3)
- OKLab
- oklab(0.556 0.171 0.092)
- CIE Lab
- lab(46.55 60.56 44.34)
- LCH
- lch(46.55 75.06 36.2)
- CMYK
- cmyk(0% 76% 80% 20%)
Tints · Shades · Tones
Tints
- D44B40
- DC6255
- E3776A
- E98B7F
- EE9F94
- F3B2A9
- F7C5BE
- FBD9D3
- FDECE9
Shades
- B12821
- 97211B
- 7E1A15
- 65130F
- 4E0C09
- 370604
- 220302
- 0F0101
- 020000
Tones
- C63E34
- C0493E
- B95347
- B35B50
- AC6259
- A46961
- 9C6F69
- 937571
- 8A7B78
Color harmonies
Complementary +180°
- CC3028
Hot Lips
- 008291
≈ Island Lush
Analogous -30° +30°
- CC3028
Hot Lips
- C42D72
≈ Pink Shadow
- AB5C00
≈ Raw Umber
Triadic +120° +240°
- CC3028
Hot Lips
- 008B37
≈ Cold Green
- 4565E3
≈ Royal Blue
Split-complementary +150° +210°
- CC3028
Hot Lips
- 008673
≈ Summer Turquoise
- 007CB3
≈ Artesian Water
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAOn white
WCAG 5.22:1 · APCA Lc 74
Ag
FailOn black
WCAG 4.02:1 · APCA Lc 27
Best text color: #FFFFFF
WCAG 5.22:1 (AA) · APCA Lc 74
Contrast pairs
Code snippets
CSS
:root {
--hot-lips: #cc3028;
--hot-lips-rgb: 204 48 40;
--hot-lips-oklch: oklch(0.556 0.194 28.3);
}
.element {
color: var(--hot-lips);
background-color: hsl(3 67% 48%);
border-color: oklch(0.556 0.194 28.3);
}Tailwind CSS v4
@theme {
--color-hot-lips: #cc3028;
--color-hot-lips-50: #ffe1d4;
--color-hot-lips-100: #ffd0c1;
--color-hot-lips-200: #ffb4a2;
--color-hot-lips-300: #ff8e7a;
--color-hot-lips-400: #fc6859;
--color-hot-lips-500: #eb3b32;
--color-hot-lips-600: #c6352c;
--color-hot-lips-700: #a02a23;
--color-hot-lips-800: #771c1b;
--color-hot-lips-900: #541311;
--color-hot-lips-950: #380304;
}SCSS
$hot-lips: #cc3028;
$hot-lips-rgb: 204, 48, 40;
$hot-lips-light: mix(#fff, $hot-lips, 20%);
$hot-lips-dark: mix(#000, $hot-lips, 20%);
.element {
color: $hot-lips;
box-shadow: 0 0 0 2px rgba($hot-lips, 0.35);
}