Nazwany kolor · #C8C387
Fiddlehead Fern
Fiddlehead Fern to #C8C387: rgb(200 195 135), hsl(55 37% 66%), oklch(0.807 0.079 104). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Fiddlehead Fern color name →
#C8C387
oklch(0.807 0.079 104)
Konwersje koloru
- HEX
- #c8c387
- RGB
- rgb(200 195 135)
- HSL
- hsl(55 37% 66%)
- HWB
- hwb(55 53% 22%)
- OKLCH
- oklch(0.807 0.079 104)
- OKLab
- oklab(0.807 -0.019 0.077)
- CIE Lab
- lab(78.14 -4.95 30.89)
- LCH
- lch(78.14 31.29 99.1)
- CMYK
- cmyk(0% 3% 32% 22%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- CDC993
- D3CF9F
- D8D5AB
- DEDBB7
- E3E1C3
- E9E7CF
- EEEDDB
- F4F3E7
- F9F9F3
Odcienie ciemniejsze
- AEA975
- 949063
- 7B7851
- 636041
- 4C4A31
- 363421
- 212013
- 0F0E06
- 020201
Tony
- C1BC87
- B9B587
- B2AF86
- AAA886
- A3A185
- 9C9A84
- 959483
- 8E8D82
- 878781
Harmonie kolorów
Komplementarna +180°
- C8C387
Fiddlehead Fern
- B9BAF2
≈ Purple Illusion
Analogowa -30° +30°
- C8C387
Fiddlehead Fern
- DFB987
≈ Jerboa
- ABCC98
≈ Oh Pistachio
Triada +120° +240°
- C8C387
Fiddlehead Fern
- 86CCE6
≈ Sky of Ocean
- E5ACCD
≈ Pink Pearl
Komplementarna rozszczepiona +150° +210°
- C8C387
Fiddlehead Fern
- 9DC3F3
≈ Sail to the Sea
- D3B1E4
≈ Whisper of Plum
Tetrada +90° +180° +270°
- C8C387
Fiddlehead Fern
- 80D0CF
≈ Aqua Splash
- B9BAF2
≈ Purple Illusion
- EEABB0
≈ Hibiscus Petal
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.80:1 · APCA Lc 34
Ag
AAANa czerni
WCAG 11.61:1 · APCA Lc 69
Najlepszy kolor tekstu: #000000
WCAG 11.61:1 (AAA) · APCA Lc 69
Contrast pairs
Fragmenty kodu
CSS
:root {
--fiddlehead-fern: #c8c387;
--fiddlehead-fern-rgb: 200 195 135;
--fiddlehead-fern-oklch: oklch(0.807 0.079 104);
}
.element {
color: var(--fiddlehead-fern);
background-color: hsl(55 37% 66%);
border-color: oklch(0.807 0.079 104);
}Tailwind CSS v4
@theme {
--color-fiddlehead-fern: #c8c387;
--color-fiddlehead-fern-50: #f8f7dd;
--color-fiddlehead-fern-100: #ebeacc;
--color-fiddlehead-fern-200: #d8d7b0;
--color-fiddlehead-fern-300: #bcba8c;
--color-fiddlehead-fern-400: #a6a16a;
--color-fiddlehead-fern-500: #8f8948;
--color-fiddlehead-fern-600: #79743e;
--color-fiddlehead-fern-700: #615d31;
--color-fiddlehead-fern-800: #484322;
--color-fiddlehead-fern-900: #322f16;
--color-fiddlehead-fern-950: #1e1b07;
}SCSS
$fiddlehead-fern: #c8c387;
$fiddlehead-fern-rgb: 200, 195, 135;
$fiddlehead-fern-light: mix(#fff, $fiddlehead-fern, 20%);
$fiddlehead-fern-dark: mix(#000, $fiddlehead-fern, 20%);
.element {
color: $fiddlehead-fern;
box-shadow: 0 0 0 2px rgba($fiddlehead-fern, 0.35);
}