Benannte Farbe · #CC2266
Sensitive Scorpion
Sensitive Scorpion ist #CC2266: rgb(204 34 102), hsl(336 71% 47%), oklch(0.558 0.205 3.9). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Sensitive Scorpion color name →
#CC2266
oklch(0.558 0.205 3.9)
Farbumrechnungen
- HEX
- #cc2266
- RGB
- rgb(204 34 102)
- HSL
- hsl(336 71% 47%)
- HWB
- hwb(336 13% 20%)
- OKLCH
- oklch(0.558 0.205 3.9)
- OKLab
- oklab(0.558 0.205 0.014)
- CIE Lab
- lab(46.16 66.47 6.62)
- LCH
- lch(46.16 66.8 5.7)
- CMYK
- cmyk(0% 83% 50% 20%)
Tints · Shades · Tones
Tints
- D44374
- DC5B83
- E37291
- E987A0
- EF9BAF
- F4AFBF
- F8C3CF
- FBD7DF
- FDEBEF
Shades
- B11C58
- 97164A
- 7E113C
- 650B2F
- 4E0723
- 370317
- 22010C
- 0F0004
- 020000
Tones
- C63569
- C0426B
- BA4D6E
- B35670
- AC5E73
- A46676
- 9C6D78
- 94747B
- 8A7A7D
Farbharmonien
Komplementär +180°
- CC2266
Sensitive Scorpion
- 00867A
≈ Mystic Turquoise
Analog -30° +30°
- CC2266
Sensitive Scorpion
- B533A4
≈ San Francisco Pink
- CF2F00
≈ Pleasant Pomegranate
Triadisch +120° +240°
- CC2266
Sensitive Scorpion
- 638000
≈ Enchanted Forest
- 007ABD
≈ Deep Cerulean
Geteilt komplementär +150° +210°
- CC2266
Sensitive Scorpion
- 008B4B
≈ Real Turquoise
- 008297
≈ Cruising
Tetradisch +90° +180° +270°
- CC2266
Sensitive Scorpion
- 8A7200
≈ Vermin Brown
- 00867A
≈ Mystic Turquoise
- 535FE9
≈ Arcane Brew
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 5.26:1 · APCA Lc 74
Ag
FailAuf Schwarz
WCAG 3.98:1 · APCA Lc 27
Beste Textfarbe: #FFFFFF
WCAG 5.26:1 (AA) · APCA Lc 74
Contrast pairs
Code-Snippets
CSS
:root {
--sensitive-scorpion: #cc2266;
--sensitive-scorpion-rgb: 204 34 102;
--sensitive-scorpion-oklch: oklch(0.558 0.205 3.9);
}
.element {
color: var(--sensitive-scorpion);
background-color: hsl(336 71% 47%);
border-color: oklch(0.558 0.205 3.9);
}Tailwind CSS v4
@theme {
--color-sensitive-scorpion: #cc2266;
--color-sensitive-scorpion-50: #ffddec;
--color-sensitive-scorpion-100: #ffcbdd;
--color-sensitive-scorpion-200: #ffaec7;
--color-sensitive-scorpion-300: #ff86a7;
--color-sensitive-scorpion-400: #fc5e91;
--color-sensitive-scorpion-500: #ea2b77;
--color-sensitive-scorpion-600: #c62865;
--color-sensitive-scorpion-700: #9f2150;
--color-sensitive-scorpion-800: #76153d;
--color-sensitive-scorpion-900: #540e2a;
--color-sensitive-scorpion-950: #380117;
}SCSS
$sensitive-scorpion: #cc2266;
$sensitive-scorpion-rgb: 204, 34, 102;
$sensitive-scorpion-light: mix(#fff, $sensitive-scorpion, 20%);
$sensitive-scorpion-dark: mix(#000, $sensitive-scorpion, 20%);
.element {
color: $sensitive-scorpion;
box-shadow: 0 0 0 2px rgba($sensitive-scorpion, 0.35);
}