Nazwany kolor · #FFC723
Cheerful Yellow
Cheerful Yellow to #FFC723: rgb(255 199 35), hsl(45 100% 57%), oklch(0.856 0.169 87). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Cheerful Yellow color name →
#FFC723
oklch(0.856 0.169 87)
Konwersje koloru
- HEX
- #ffc723
- RGB
- rgb(255 199 35)
- HSL
- hsl(45 100% 57%)
- HWB
- hwb(45 14% 0%)
- OKLCH
- oklch(0.856 0.169 87)
- OKLab
- oklab(0.856 0.009 0.168)
- CIE Lab
- lab(83.6 10.99 79.32)
- LCH
- lch(83.6 80.07 82.1)
- CMYK
- cmyk(0% 22% 86% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FFCD4C
- FFD367
- FFD97E
- FFDF93
- FFE4A6
- FFEAB9
- FFEFCB
- FFF5DC
- FFFAEE
Odcienie ciemniejsze
- DEAD1D
- BE9317
- 9E7A11
- 80620C
- 634C07
- 483604
- 2E2101
- 160E00
- 030200
Tony
- F2C03C
- E5B94B
- D8B257
- CBAB60
- BEA468
- B19D6E
- A59674
- 988F79
- 8C877D
Harmonie kolorów
Komplementarna +180°
- FFC723
Cheerful Yellow
- BBCFFF
≈ Ice Cold Stare
Analogowa -30° +30°
- FFC723
Cheerful Yellow
- FFC194
≈ Wispy White
- C9DD4B
≈ Greenivorous
Triada +120° +240°
- FFC723
Cheerful Yellow
- 21E9FF
≈ Whimsical Blue
- FFAFFE
≈ Jigglypuff
Komplementarna rozszczepiona +150° +210°
- FFC723
Cheerful Yellow
- 9CD8FF
≈ Shiva Blue
- D5C5FF
≈ Innocent Snowdrop
Tetrada +90° +180° +270°
- FFC723
Cheerful Yellow
- 00F1CE
≈ Fake Jade
- BBCFFF
≈ Ice Cold Stare
- FFB9D0
≈ Baby Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.56:1 · APCA Lc 25
Ag
AAANa czerni
WCAG 13.44:1 · APCA Lc 78
Najlepszy kolor tekstu: #000000
WCAG 13.44:1 (AAA) · APCA Lc 78
Contrast pairs
Fragmenty kodu
CSS
:root {
--cheerful-yellow: #ffc723;
--cheerful-yellow-rgb: 255 199 35;
--cheerful-yellow-oklch: oklch(0.856 0.169 87);
}
.element {
color: var(--cheerful-yellow);
background-color: hsl(45 100% 57%);
border-color: oklch(0.856 0.169 87);
}Tailwind CSS v4
@theme {
--color-cheerful-yellow: #ffc723;
--color-cheerful-yellow-50: #fff4be;
--color-cheerful-yellow-100: #ffe6a7;
--color-cheerful-yellow-200: #f1d17d;
--color-cheerful-yellow-300: #dab242;
--color-cheerful-yellow-400: #c99600;
--color-cheerful-yellow-500: #b57a00;
--color-cheerful-yellow-600: #996800;
--color-cheerful-yellow-700: #7b5300;
--color-cheerful-yellow-800: #5d3b00;
--color-cheerful-yellow-900: #412900;
--color-cheerful-yellow-950: #291600;
}SCSS
$cheerful-yellow: #ffc723;
$cheerful-yellow-rgb: 255, 199, 35;
$cheerful-yellow-light: mix(#fff, $cheerful-yellow, 20%);
$cheerful-yellow-dark: mix(#000, $cheerful-yellow, 20%);
.element {
color: $cheerful-yellow;
box-shadow: 0 0 0 2px rgba($cheerful-yellow, 0.35);
}