Benannte Farbe · #B9DCC3
Sprite Twist
Sprite Twist ist #B9DCC3: rgb(185 220 195), hsl(137 33% 79%), oklch(0.862 0.05 154.2). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Green mean? → · Sprite Twist color name →
#B9DCC3
oklch(0.862 0.05 154.2)
Farbumrechnungen
- HEX
- #b9dcc3
- RGB
- rgb(185 220 195)
- HSL
- hsl(137 33% 79%)
- HWB
- hwb(137 73% 14%)
- OKLCH
- oklch(0.862 0.05 154.2)
- OKLab
- oklab(0.862 -0.045 0.022)
- CIE Lab
- lab(84.69 -15.56 8.3)
- LCH
- lch(84.69 17.64 151.9)
- CMYK
- cmyk(16% 0% 11% 14%)
Tints · Shades · Tones
Tints
- C0E0C9
- C7E3CF
- CEE7D5
- D5EADB
- DCEEE1
- E3F1E7
- EAF5ED
- F1F8F3
- F8FCF9
Shades
- A0BFA9
- 89A390
- 718878
- 5B6E60
- 46544A
- 313C34
- 1E2620
- 0D110E
- 020202
Tones
- B3D2BC
- AEC9B5
- A8C0AE
- A2B6A8
- 9CADA1
- 97A49A
- 919B94
- 8B928D
- 868986
Farbharmonien
Komplementär +180°
- B9DCC3
Sprite Twist
- E7C6DF
≈ Pink Pony
Analog -30° +30°
- B9DCC3
Sprite Twist
- CAD8B4
≈ Spice Garden
- AEDDD5
≈ Jaded Clouds
Triadisch +120° +240°
- B9DCC3
Sprite Twist
- C7D0F4
≈ Frozen Periwinkle
- F1C7BC
≈ Fleecy Dreams
Geteilt komplementär +150° +210°
- B9DCC3
Sprite Twist
- D9CAED
≈ Foggy Love
- F0C5CE
≈ Soft Satin
Tetradisch +90° +180° +270°
- B9DCC3
Sprite Twist
- B7D6F1
≈ Summer Birthday
- E7C6DF
≈ Pink Pony
- EACBB0
≈ Sweet Orange
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.49:1 · APCA Lc 23
Ag
AAAAuf Schwarz
WCAG 14.08:1 · APCA Lc 80
Beste Textfarbe: #000000
WCAG 14.08:1 (AAA) · APCA Lc 80
Contrast pairs
Code-Snippets
CSS
:root {
--sprite-twist: #b9dcc3;
--sprite-twist-rgb: 185 220 195;
--sprite-twist-oklch: oklch(0.862 0.05 154.2);
}
.element {
color: var(--sprite-twist);
background-color: hsl(137 33% 79%);
border-color: oklch(0.862 0.05 154.2);
}Tailwind CSS v4
@theme {
--color-sprite-twist: #b9dcc3;
--color-sprite-twist-50: #eafaef;
--color-sprite-twist-100: #dbede1;
--color-sprite-twist-200: #c4dbcb;
--color-sprite-twist-300: #a3c0ad;
--color-sprite-twist-400: #88a891;
--color-sprite-twist-500: #6c9077;
--color-sprite-twist-600: #5c7a65;
--color-sprite-twist-700: #496251;
--color-sprite-twist-800: #35483a;
--color-sprite-twist-900: #243228;
--color-sprite-twist-950: #131e16;
}SCSS
$sprite-twist: #b9dcc3;
$sprite-twist-rgb: 185, 220, 195;
$sprite-twist-light: mix(#fff, $sprite-twist, 20%);
$sprite-twist-dark: mix(#000, $sprite-twist, 20%);
.element {
color: $sprite-twist;
box-shadow: 0 0 0 2px rgba($sprite-twist, 0.35);
}