Benannte Farbe · #23C48B
Píng Gǔo Lǜ Green
Píng Gǔo Lǜ Green ist #23C48B: rgb(35 196 139), hsl(159 70% 45%), oklch(0.729 0.151 162.7). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Green mean? → · Píng Gǔo Lǜ Green color name →
#23C48B
oklch(0.729 0.151 162.7)
Farbumrechnungen
- HEX
- #23c48b
- RGB
- rgb(35 196 139)
- HSL
- hsl(159 70% 45%)
- HWB
- hwb(159 14% 23%)
- OKLCH
- oklch(0.729 0.151 162.7)
- OKLab
- oklab(0.729 -0.144 0.045)
- CIE Lab
- lab(70.53 -51.27 17.01)
- LCH
- lch(70.53 54.02 161.6)
- CMYK
- cmyk(82% 0% 29% 23%)
Tints · Shades · Tones
Tints
- 4BCA96
- 66D0A2
- 7DD7AD
- 92DDB8
- A5E3C4
- B8E8D0
- CAEEDB
- DCF4E7
- EEF9F3
Shades
- 1DAA78
- 179166
- 117854
- 0C6143
- 074A32
- 043523
- 012114
- 000E07
- 000201
Tones
- 3BBD8A
- 4AB789
- 56B088
- 5FA987
- 67A286
- 6E9C85
- 739584
- 788E83
- 7C8781
Farbharmonien
Komplementär +180°
- 23C48B
Píng Gǔo Lǜ Green
- E77EC1
≈ Fuchsia Blush
Analog -30° +30°
- 23C48B
Píng Gǔo Lǜ Green
- 81BB50
≈ Ultra Green
- 00BFBC
≈ Cala Benirrás Blue
Triadisch +120° +240°
- 23C48B
Píng Gǔo Lǜ Green
- 9B9AFF
≈ Cobalite
- F48455
≈ Autumn Sunset
Geteilt komplementär +150° +210°
- 23C48B
Píng Gǔo Lǜ Green
- C889EB
≈ Lavender Perceptions
- F67B8D
≈ Flower Blossom Pink
Tetradisch +90° +180° +270°
- 23C48B
Píng Gǔo Lǜ Green
- 60ABFF
≈ Âbi Blue
- E77EC1
≈ Fuchsia Blush
- E09616
≈ Beige Red
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.24:1 · APCA Lc 44
Ag
AAAAuf Schwarz
WCAG 9.34:1 · APCA Lc 58
Beste Textfarbe: #000000
WCAG 9.34:1 (AAA) · APCA Lc 58
Contrast pairs
Code-Snippets
CSS
:root {
--ping-guo-lu-green: #23c48b;
--ping-guo-lu-green-rgb: 35 196 139;
--ping-guo-lu-green-oklch: oklch(0.729 0.151 162.7);
}
.element {
color: var(--ping-guo-lu-green);
background-color: hsl(159 70% 45%);
border-color: oklch(0.729 0.151 162.7);
}Tailwind CSS v4
@theme {
--color-ping-guo-lu-green: #23c48b;
--color-ping-guo-lu-green-50: #ceffea;
--color-ping-guo-lu-green-100: #b9f9db;
--color-ping-guo-lu-green-200: #94e9c4;
--color-ping-guo-lu-green-300: #62d0a4;
--color-ping-guo-lu-green-400: #25b984;
--color-ping-guo-lu-green-500: #00a368;
--color-ping-guo-lu-green-600: #008a58;
--color-ping-guo-lu-green-700: #006f46;
--color-ping-guo-lu-green-800: #005230;
--color-ping-guo-lu-green-900: #003921;
--color-ping-guo-lu-green-950: #002310;
}SCSS
$ping-guo-lu-green: #23c48b;
$ping-guo-lu-green-rgb: 35, 196, 139;
$ping-guo-lu-green-light: mix(#fff, $ping-guo-lu-green, 20%);
$ping-guo-lu-green-dark: mix(#000, $ping-guo-lu-green, 20%);
.element {
color: $ping-guo-lu-green;
box-shadow: 0 0 0 2px rgba($ping-guo-lu-green, 0.35);
}