Benannte Farbe · #9F414B
Charleston Cherry
Charleston Cherry ist #9F414B: rgb(159 65 75), hsl(354 42% 44%), oklch(0.504 0.125 16.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Charleston Cherry color name →
#9F414B
oklch(0.504 0.125 16.3)
Farbumrechnungen
- HEX
- #9f414b
- RGB
- rgb(159 65 75)
- HSL
- hsl(354 42% 44%)
- HWB
- hwb(354 25% 38%)
- OKLCH
- oklch(0.504 0.125 16.3)
- OKLab
- oklab(0.504 0.12 0.035)
- CIE Lab
- lab(41.1 40.46 14.88)
- LCH
- lch(41.1 43.11 20.2)
- CMYK
- cmyk(0% 59% 53% 38%)
Tints · Shades · Tones
Tints
- AA545B
- B5676C
- C07A7D
- CA8C8F
- D39FA1
- DDB2B3
- E6C5C6
- EFD8D8
- F7EBEC
Shades
- 8A3740
- 752E35
- 61252B
- 4D1C21
- 3B1317
- 290B0E
- 180506
- 090102
- 010000
Tones
- 9D4950
- 9B5056
- 99575B
- 965D60
- 936365
- 90696B
- 8D6F70
- 897575
- 857A7B
Farbharmonien
Komplementär +180°
- 9F414B
Charleston Cherry
- 007375
≈ Natural Instinct Green
Analog -30° +30°
- 9F414B
Charleston Cherry
- 954373
≈ Purple Peril
- 9C491A
≈ Rendang
Triadisch +120° +240°
- 9F414B
Charleston Cherry
- 407423
≈ Forest Empress
- 2F64AA
≈ Shukra Blue
Geteilt komplementär +150° +210°
- 9F414B
Charleston Cherry
- 007757
≈ Victoria Peak
- 006F8E
≈ Seaport
Tetradisch +90° +180° +270°
- 9F414B
Charleston Cherry
- 6D6800
≈ Worn Olive
- 007375
≈ Natural Instinct Green
- 6057A8
≈ Yuè Guāng Lán Moonlight
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 6.30:1 · APCA Lc 81
Ag
FailAuf Schwarz
WCAG 3.33:1 · APCA Lc 21
Beste Textfarbe: #FFFFFF
WCAG 6.30:1 (AA) · APCA Lc 81
Contrast pairs
Code-Snippets
CSS
:root {
--charleston-cherry: #9f414b;
--charleston-cherry-rgb: 159 65 75;
--charleston-cherry-oklch: oklch(0.504 0.125 16.3);
}
.element {
color: var(--charleston-cherry);
background-color: hsl(354 42% 44%);
border-color: oklch(0.504 0.125 16.3);
}Tailwind CSS v4
@theme {
--color-charleston-cherry: #9f414b;
--color-charleston-cherry-50: #ffe8e7;
--color-charleston-cherry-100: #ffd8d8;
--color-charleston-cherry-200: #ffbfc0;
--color-charleston-cherry-300: #f19d9f;
--color-charleston-cherry-400: #de7e85;
--color-charleston-cherry-500: #cb5f69;
--color-charleston-cherry-600: #ac5159;
--color-charleston-cherry-700: #8a4147;
--color-charleston-cherry-800: #662e35;
--color-charleston-cherry-900: #481f24;
--color-charleston-cherry-950: #2f0e13;
}SCSS
$charleston-cherry: #9f414b;
$charleston-cherry-rgb: 159, 65, 75;
$charleston-cherry-light: mix(#fff, $charleston-cherry, 20%);
$charleston-cherry-dark: mix(#000, $charleston-cherry, 20%);
.element {
color: $charleston-cherry;
box-shadow: 0 0 0 2px rgba($charleston-cherry, 0.35);
}