Benannte Farbe · #314747
Winter Balsam
Winter Balsam ist #314747: rgb(49 71 71), hsl(180 18% 24%), oklch(0.38 0.027 196.1). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Winter Balsam color name →
#314747
oklch(0.38 0.027 196.1)
Farbumrechnungen
- HEX
- #314747
- RGB
- rgb(49 71 71)
- HSL
- hsl(180 18% 24%)
- HWB
- hwb(180 19% 72%)
- OKLCH
- oklch(0.38 0.027 196.1)
- OKLab
- oklab(0.38 -0.026 -0.008)
- CIE Lab
- lab(28.33 -8.87 -2.92)
- LCH
- lch(28.33 9.34 198.2)
- CMYK
- cmyk(31% 0% 0% 72%)
Tints · Shades · Tones
Tints
- 435757
- 566868
- 6A7A7A
- 7E8C8C
- 929E9E
- A7B1B1
- BCC4C4
- D2D7D7
- E8EBEB
Shades
- 293D3D
- 223232
- 1A2828
- 131F1F
- 0C1616
- 060D0D
- 030606
- 010202
- 000000
Tones
- 394C4C
- 405252
- 485857
- 505D5D
- 586363
- 606969
- 686E6E
- 707474
- 787A7A
Farbharmonien
Komplementär +180°
- 314747
Winter Balsam
- 503D3D
≈ Magenta Ink
Analog -30° +30°
- 314747
Winter Balsam
- 35473F
≈ Rich Grey Turquoise
- 33464E
≈ Gale Force
Triadisch +120° +240°
- 314747
Winter Balsam
- 483E4C
≈ Funkie Friday
- 4B4132
≈ Cannon Ball
Geteilt komplementär +150° +210°
- 314747
Winter Balsam
- 4D3D45
≈ Requiem
- 4F3E36
≈ Obsidian Brown
Tetradisch +90° +180° +270°
- 314747
Winter Balsam
- 414051
≈ Blueberry Tart
- 503D3D
≈ Magenta Ink
- 444333
≈ Vermilion Green
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 9.89:1 · APCA Lc 93
Ag
FailAuf Schwarz
WCAG 2.12:1 · APCA Lc 10
Beste Textfarbe: #FFFFFF
WCAG 9.89:1 (AAA) · APCA Lc 93
Contrast pairs
Code-Snippets
CSS
:root {
--winter-balsam: #314747;
--winter-balsam-rgb: 49 71 71;
--winter-balsam-oklch: oklch(0.38 0.027 196.1);
}
.element {
color: var(--winter-balsam);
background-color: hsl(180 18% 24%);
border-color: oklch(0.38 0.027 196.1);
}Tailwind CSS v4
@theme {
--color-winter-balsam: #314747;
--color-winter-balsam-50: #edf8f8;
--color-winter-balsam-100: #deebeb;
--color-winter-balsam-200: #c8d8d8;
--color-winter-balsam-300: #a8bcbc;
--color-winter-balsam-400: #8da4a4;
--color-winter-balsam-500: #728c8c;
--color-winter-balsam-600: #607776;
--color-winter-balsam-700: #4d5f5f;
--color-winter-balsam-800: #384545;
--color-winter-balsam-900: #263030;
--color-winter-balsam-950: #141c1c;
}SCSS
$winter-balsam: #314747;
$winter-balsam-rgb: 49, 71, 71;
$winter-balsam-light: mix(#fff, $winter-balsam, 20%);
$winter-balsam-dark: mix(#000, $winter-balsam, 20%);
.element {
color: $winter-balsam;
box-shadow: 0 0 0 2px rgba($winter-balsam, 0.35);
}