Benannte Farbe · #52A786
Laurel Wreath
Laurel Wreath ist #52A786: rgb(82 167 134), hsl(157 34% 49%), oklch(0.666 0.097 165.8). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Green mean? → · Laurel Wreath color name →
#52A786
oklch(0.666 0.097 165.8)
Farbumrechnungen
- HEX
- #52a786
- RGB
- rgb(82 167 134)
- HSL
- hsl(157 34% 49%)
- HWB
- hwb(157 32% 35%)
- OKLCH
- oklch(0.666 0.097 165.8)
- OKLab
- oklab(0.666 -0.094 0.024)
- CIE Lab
- lab(62.53 -33.09 8.86)
- LCH
- lch(62.53 34.25 165)
- CMYK
- cmyk(51% 0% 20% 35%)
Tints · Shades · Tones
Tints
- 66B092
- 78B99D
- 89C1A9
- 9ACAB5
- ABD3C1
- BCDCCD
- CDE4D9
- DEEDE6
- EEF6F2
Shades
- 469174
- 3B7B62
- 2F6651
- 255240
- 1A3E30
- 112C21
- 081A13
- 020A06
- 000101
Tones
- 59A385
- 5F9F85
- 659C84
- 6A9884
- 6E9483
- 729083
- 768C82
- 7A8881
- 7D8481
Farbharmonien
Komplementär +180°
- 52A786
Laurel Wreath
- BF7BA1
≈ Hollyhock Blossom Pink
Analog -30° +30°
- 52A786
Laurel Wreath
- 79A265
≈ Bulbasaur
- 38A6A7
≈ Tidal Teal
Triadisch +120° +240°
- 52A786
Laurel Wreath
- 8F8BCD
≈ Adora
- C68160
≈ Clove Bud
Geteilt komplementär +150° +210°
- 52A786
Laurel Wreath
- AB81BD
≈ Wisteria
- C87B80
≈ Dirty Pink
Tetradisch +90° +180° +270°
- 52A786
Laurel Wreath
- 6B96CF
≈ Zeus Temple
- BF7BA1
≈ Hollyhock Blossom Pink
- B68B4B
≈ Yellow Acorn
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.90:1 · APCA Lc 55
Ag
AAAAuf Schwarz
WCAG 7.23:1 · APCA Lc 47
Beste Textfarbe: #000000
WCAG 7.23:1 (AAA) · APCA Lc 47
Contrast pairs
Code-Snippets
CSS
:root {
--laurel-wreath: #52a786;
--laurel-wreath-rgb: 82 167 134;
--laurel-wreath-oklch: oklch(0.666 0.097 165.8);
}
.element {
color: var(--laurel-wreath);
background-color: hsl(157 34% 49%);
border-color: oklch(0.666 0.097 165.8);
}Tailwind CSS v4
@theme {
--color-laurel-wreath: #52a786;
--color-laurel-wreath-50: #dcfff0;
--color-laurel-wreath-100: #caf3e2;
--color-laurel-wreath-200: #ace2cc;
--color-laurel-wreath-300: #85c8ae;
--color-laurel-wreath-400: #62b191;
--color-laurel-wreath-500: #379a77;
--color-laurel-wreath-600: #318365;
--color-laurel-wreath-700: #276951;
--color-laurel-wreath-800: #1c4d39;
--color-laurel-wreath-900: #123527;
--color-laurel-wreath-950: #042015;
}SCSS
$laurel-wreath: #52a786;
$laurel-wreath-rgb: 82, 167, 134;
$laurel-wreath-light: mix(#fff, $laurel-wreath, 20%);
$laurel-wreath-dark: mix(#000, $laurel-wreath, 20%);
.element {
color: $laurel-wreath;
box-shadow: 0 0 0 2px rgba($laurel-wreath, 0.35);
}