Benannte Farbe · #96CED5
Peppermint Twist
Peppermint Twist ist #96CED5: rgb(150 206 213), hsl(187 43% 71%), oklch(0.815 0.058 205.7). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Cyan mean? → · Peppermint Twist color name →
#96CED5
oklch(0.815 0.058 205.7)
Farbumrechnungen
- HEX
- #96ced5
- RGB
- rgb(150 206 213)
- HSL
- hsl(187 43% 71%)
- HWB
- hwb(187 59% 16%)
- OKLCH
- oklch(0.815 0.058 205.7)
- OKLab
- oklab(0.815 -0.053 -0.025)
- CIE Lab
- lab(79.08 -17.48 -9.64)
- LCH
- lch(79.08 19.96 208.9)
- CMYK
- cmyk(30% 3% 0% 16%)
Tints · Shades · Tones
Tints
- A1D3D9
- ACD8DD
- B6DDE2
- C1E2E6
- CBE7EA
- D6EBEE
- E0F0F2
- EAF5F7
- F5FAFB
Shades
- 82B3B9
- 6E989E
- 5B7F83
- 49666A
- 374E51
- 26383A
- 162324
- 080F10
- 010202
Tones
- 94C6CC
- 93BEC3
- 91B6BB
- 8FAEB2
- 8CA6AA
- 8A9FA1
- 889799
- 858F90
- 838888
Farbharmonien
Komplementär +180°
- 96CED5
Peppermint Twist
- E6B5AF
≈ Pink Dust
Analog -30° +30°
- 96CED5
Peppermint Twist
- 9BCFC1
≈ Thermal Aqua
- 9FC9E4
≈ Windsor Way
Triadisch +120° +240°
- 96CED5
Peppermint Twist
- D7B6D7
≈ Lilac Haze
- D4C198
≈ Sandy Pail
Geteilt komplementär +150° +210°
- 96CED5
Peppermint Twist
- E3B4C4
≈ Japanese Rose Garden
- E1B99F
≈ So Baja
Tetradisch +90° +180° +270°
- 96CED5
Peppermint Twist
- C5BCE5
≈ Viking Diva
- E6B5AF
≈ Pink Dust
- C0C89D
≈ Seedling
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.73:1 · APCA Lc 31
Ag
AAAAuf Schwarz
WCAG 12.08:1 · APCA Lc 71
Beste Textfarbe: #000000
WCAG 12.08:1 (AAA) · APCA Lc 71
Contrast pairs
Code-Snippets
CSS
:root {
--peppermint-twist: #96ced5;
--peppermint-twist-rgb: 150 206 213;
--peppermint-twist-oklch: oklch(0.815 0.058 205.7);
}
.element {
color: var(--peppermint-twist);
background-color: hsl(187 43% 71%);
border-color: oklch(0.815 0.058 205.7);
}Tailwind CSS v4
@theme {
--color-peppermint-twist: #96ced5;
--color-peppermint-twist-50: #e3fafe;
--color-peppermint-twist-100: #d3eef2;
--color-peppermint-twist-200: #b8dce1;
--color-peppermint-twist-300: #95c0c7;
--color-peppermint-twist-400: #75a9af;
--color-peppermint-twist-500: #549299;
--color-peppermint-twist-600: #487b81;
--color-peppermint-twist-700: #396368;
--color-peppermint-twist-800: #29484c;
--color-peppermint-twist-900: #1b3234;
--color-peppermint-twist-950: #0b1e20;
}SCSS
$peppermint-twist: #96ced5;
$peppermint-twist-rgb: 150, 206, 213;
$peppermint-twist-light: mix(#fff, $peppermint-twist, 20%);
$peppermint-twist-dark: mix(#000, $peppermint-twist, 20%);
.element {
color: $peppermint-twist;
box-shadow: 0 0 0 2px rgba($peppermint-twist, 0.35);
}