Nazwany kolor · #338860
Exquisite Emerald
Exquisite Emerald to #338860: rgb(51 136 96), hsl(152 45% 37%), oklch(0.564 0.103 159.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Exquisite Emerald color name →
#338860
oklch(0.564 0.103 159.8)
Konwersje koloru
- HEX
- #338860
- RGB
- rgb(51 136 96)
- HSL
- hsl(152 45% 37%)
- HWB
- hwb(152 20% 47%)
- OKLCH
- oklch(0.564 0.103 159.8)
- OKLab
- oklab(0.564 -0.097 0.036)
- CIE Lab
- lab(50.8 -34.21 13.66)
- LCH
- lch(50.8 36.83 158.2)
- CMYK
- cmyk(63% 0% 29% 47%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 4B946F
- 609F7E
- 75AB8D
- 89B79D
- 9CC3AD
- B0CFBD
- C3DBCD
- D7E7DD
- EBF3EE
Odcienie ciemniejsze
- 2B7552
- 236345
- 1C5238
- 14412C
- 0D3120
- 072215
- 03130A
- 010603
- 000100
Tony
- 3E8763
- 488767
- 51866A
- 59856D
- 608570
- 678473
- 6E8377
- 74827A
- 7A817D
Harmonie kolorów
Komplementarna +180°
- 338860
Exquisite Emerald
- 9D5C89
≈ Kyo Purple
Analogowa -30° +30°
- 338860
Exquisite Emerald
- 62823D
≈ Swamp Moss
- 008882
≈ Eyeshadow Turquoise
Triada +120° +240°
- 338860
Exquisite Emerald
- 6A6EB1
≈ Mediaeval
- A85F45
≈ Colourful Leaves
Komplementarna rozszczepiona +150° +210°
- 338860
Exquisite Emerald
- 8864A3
≈ Chive Blossom
- A95A68
≈ Ruby Petals
Tetrada +90° +180° +270°
- 338860
Exquisite Emerald
- 4279B0
≈ Viennese Blue
- 9D5C89
≈ Kyo Purple
- 9C6A27
≈ Stage Gold
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.34:1 · APCA Lc 70
Ag
AANa czerni
WCAG 4.83:1 · APCA Lc 32
Najlepszy kolor tekstu: #000000
WCAG 4.83:1 (AA) · APCA Lc 32
Contrast pairs
Fragmenty kodu
CSS
:root {
--exquisite-emerald: #338860;
--exquisite-emerald-rgb: 51 136 96;
--exquisite-emerald-oklch: oklch(0.564 0.103 159.8);
}
.element {
color: var(--exquisite-emerald);
background-color: hsl(152 45% 37%);
border-color: oklch(0.564 0.103 159.8);
}Tailwind CSS v4
@theme {
--color-exquisite-emerald: #338860;
--color-exquisite-emerald-50: #dcffec;
--color-exquisite-emerald-100: #caf3dd;
--color-exquisite-emerald-200: #ade3c7;
--color-exquisite-emerald-300: #86c8a7;
--color-exquisite-emerald-400: #64b189;
--color-exquisite-emerald-500: #3b9b6e;
--color-exquisite-emerald-600: #34835d;
--color-exquisite-emerald-700: #29694a;
--color-exquisite-emerald-800: #1e4d34;
--color-exquisite-emerald-900: #143624;
--color-exquisite-emerald-950: #052112;
}SCSS
$exquisite-emerald: #338860;
$exquisite-emerald-rgb: 51, 136, 96;
$exquisite-emerald-light: mix(#fff, $exquisite-emerald, 20%);
$exquisite-emerald-dark: mix(#000, $exquisite-emerald, 20%);
.element {
color: $exquisite-emerald;
box-shadow: 0 0 0 2px rgba($exquisite-emerald, 0.35);
}