Benannte Farbe · #158078
Autumn Pine Green
Autumn Pine Green ist #158078: rgb(21 128 120), hsl(176 72% 29%), oklch(0.542 0.09 186.9). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Teal mean? → · Autumn Pine Green color name →
#158078
oklch(0.542 0.09 186.9)
Farbumrechnungen
- HEX
- #158078
- RGB
- rgb(21 128 120)
- HSL
- hsl(176 72% 29%)
- HWB
- hwb(176 8% 50%)
- OKLCH
- oklch(0.542 0.09 186.9)
- OKLab
- oklab(0.542 -0.089 -0.011)
- CIE Lab
- lab(47.98 -30.9 -4.28)
- LCH
- lch(47.98 31.2 187.9)
- CMYK
- cmyk(84% 0% 6% 50%)
Tints · Shades · Tones
Tints
- 398C85
- 539991
- 69A59F
- 7FB2AC
- 95BEB9
- AACBC7
- BFD8D5
- D4E5E3
- EAF2F1
Shades
- 116E67
- 0C5D57
- 084D48
- 053D39
- 032E2A
- 021F1D
- 011210
- 000605
- 000101
Tones
- 2B8079
- 39807A
- 45817A
- 4F817B
- 59817C
- 61817D
- 6A817E
- 71807E
- 79807F
Farbharmonien
Komplementär +180°
- 158078
Autumn Pine Green
- 9B5866
≈ Mission Wildflower
Analog -30° +30°
- 158078
Autumn Pine Green
- 3D7F5A
≈ Leisure Green
- 1A7C91
≈ Pagoda
Triadisch +120° +240°
- 158078
Autumn Pine Green
- 7D6198
≈ Jubilee
- 926431
≈ Retrofit
Geteilt komplementär +150° +210°
- 158078
Autumn Pine Green
- 915A83
≈ Antique Fuchsia
- 9C5C49
≈ Chutney
Tetradisch +90° +180° +270°
- 158078
Autumn Pine Green
- 626AA3
≈ Twinkle Night
- 9B5866
≈ Mission Wildflower
- 7E6F2B
≈ Tarnished Brass
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 4.78:1 · APCA Lc 73
Ag
FailAuf Schwarz
WCAG 4.39:1 · APCA Lc 29
Beste Textfarbe: #FFFFFF
WCAG 4.78:1 (AA) · APCA Lc 73
Contrast pairs
Code-Snippets
CSS
:root {
--autumn-pine-green: #158078;
--autumn-pine-green-rgb: 21 128 120;
--autumn-pine-green-oklch: oklch(0.542 0.09 186.9);
}
.element {
color: var(--autumn-pine-green);
background-color: hsl(176 72% 29%);
border-color: oklch(0.542 0.09 186.9);
}Tailwind CSS v4
@theme {
--color-autumn-pine-green: #158078;
--color-autumn-pine-green-50: #d9fefa;
--color-autumn-pine-green-100: #c7f2ee;
--color-autumn-pine-green-200: #a8e1dc;
--color-autumn-pine-green-300: #80c7c1;
--color-autumn-pine-green-400: #58b0a7;
--color-autumn-pine-green-500: #269990;
--color-autumn-pine-green-600: #24827a;
--color-autumn-pine-green-700: #1d6861;
--color-autumn-pine-green-800: #134c46;
--color-autumn-pine-green-900: #0c3531;
--color-autumn-pine-green-950: #00201d;
}SCSS
$autumn-pine-green: #158078;
$autumn-pine-green-rgb: 21, 128, 120;
$autumn-pine-green-light: mix(#fff, $autumn-pine-green, 20%);
$autumn-pine-green-dark: mix(#000, $autumn-pine-green, 20%);
.element {
color: $autumn-pine-green;
box-shadow: 0 0 0 2px rgba($autumn-pine-green, 0.35);
}