Nazwany kolor · #FCEF01
Asfar Yellow
Asfar Yellow to #FCEF01: rgb(252 239 1), hsl(57 99% 50%), oklch(0.932 0.198 105.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Asfar Yellow color name →
#FCEF01
oklch(0.932 0.198 105.6)
Konwersje koloru
- HEX
- #fcef01
- RGB
- rgb(252 239 1)
- HSL
- hsl(57 99% 50%)
- HWB
- hwb(57 0% 1%)
- OKLCH
- oklch(0.932 0.198 105.6)
- OKLab
- oklab(0.932 -0.053 0.191)
- CIE Lab
- lab(93.25 -9.66 90.2)
- LCH
- lch(93.25 90.71 96.1)
- CMYK
- cmyk(0% 5% 100% 1%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FCF149
- FCF368
- FCF580
- FCF796
- FDF9A9
- FDFABC
- FDFCCD
- FEFDDE
- FEFEEF
Odcienie ciemniejsze
- DBD001
- BBB101
- 9C9400
- 7E7800
- 625C00
- 474200
- 2D2A00
- 161400
- 030300
Tony
- EFE435
- E2D84A
- D5CD57
- C8C262
- BBB76A
- AFAC71
- A3A176
- 97967A
- 8B8B7D
Harmonie kolorów
Komplementarna +180°
- FCEF01
Asfar Yellow
- E6E6FF
≈ Lavender Mist
Analogowa -30° +30°
- FCEF01
Asfar Yellow
- FFE4C0
≈ Cheese Powder
- BCFF9A
≈ Apatite Crystal Green
Triada +120° +240°
- FCEF01
Asfar Yellow
- CBEFFF
≈ Heaven’s Gate
- FFDEEF
≈ Transparent Pink
Komplementarna rozszczepiona +150° +210°
- FCEF01
Asfar Yellow
- DBEAFF
≈ Cloudless
- F5E0FF
≈ Lavender Savour
Tetrada +90° +180° +270°
- FCEF01
Asfar Yellow
- 8DFFFF
≈ Glitter Shower
- E6E6FF
≈ Lavender Mist
- FFE0E1
≈ Red Remains
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.20:1 · APCA Lc 10
Ag
AAANa czerni
WCAG 17.48:1 · APCA Lc 95
Najlepszy kolor tekstu: #000000
WCAG 17.48:1 (AAA) · APCA Lc 95
Contrast pairs
Fragmenty kodu
CSS
:root {
--asfar-yellow: #fcef01;
--asfar-yellow-rgb: 252 239 1;
--asfar-yellow-oklch: oklch(0.932 0.198 105.6);
}
.element {
color: var(--asfar-yellow);
background-color: hsl(57 99% 50%);
border-color: oklch(0.932 0.198 105.6);
}Tailwind CSS v4
@theme {
--color-asfar-yellow: #fcef01;
--color-asfar-yellow-50: #fafab8;
--color-asfar-yellow-100: #eeed9f;
--color-asfar-yellow-200: #ddda70;
--color-asfar-yellow-300: #c2be25;
--color-asfar-yellow-400: #b0a300;
--color-asfar-yellow-500: #9b8900;
--color-asfar-yellow-600: #837400;
--color-asfar-yellow-700: #695d00;
--color-asfar-yellow-800: #4f4300;
--color-asfar-yellow-900: #372e00;
--color-asfar-yellow-950: #221b00;
}SCSS
$asfar-yellow: #fcef01;
$asfar-yellow-rgb: 252, 239, 1;
$asfar-yellow-light: mix(#fff, $asfar-yellow, 20%);
$asfar-yellow-dark: mix(#000, $asfar-yellow, 20%);
.element {
color: $asfar-yellow;
box-shadow: 0 0 0 2px rgba($asfar-yellow, 0.35);
}