Colore con nome · #FFD10B
Happy Face
Happy Face è #FFD10B: rgb(255 209 11), hsl(49 100% 52%), oklch(0.875 0.178 92.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · Happy Face color name →
#FFD10B
oklch(0.875 0.178 92.5)
Conversioni di colore
- HEX
- #ffd10b
- RGB
- rgb(255 209 11)
- HSL
- hsl(49 100% 52%)
- HWB
- hwb(49 4% 0%)
- OKLCH
- oklch(0.875 0.178 92.5)
- OKLab
- oklab(0.875 -0.008 0.178)
- CIE Lab
- lab(86 5.87 84.66)
- LCH
- lch(86 84.87 86)
- CMYK
- cmyk(0% 18% 96% 0%)
Tinte · Ombre · Toni
Tinte
- FFD646
- FFDB64
- FFE07C
- FFE592
- FFEAA6
- FFEEB8
- FFF2CB
- FFF7DC
- FFFBEE
Ombre
- DEB508
- BE9B06
- 9E8104
- 806802
- 635001
- 483901
- 2E2300
- 161000
- 030200
Toni
- F2C934
- E4C147
- D7B954
- CAB15F
- BEA967
- B1A16E
- A49974
- 989078
- 8C887D
Armonie di colore
Complementare +180°
- FFD10B
Happy Face
- C8D4FF
≈ Pale Phthalo Blue
Analogo -30° +30°
- FFD10B
Happy Face
- FFCA9C
≈ Peachy Breezes
- C1E853
≈ Energos
Triadico +120° +240°
- FFD10B
Happy Face
- 7AE9FF
≈ Robin’s Egg
- FFBDF4
≈ Pink Quartz
Complementare divisa +150° +210°
- FFD10B
Happy Face
- B0DCFF
≈ Droplet
- DFCBFF
≈ Foggy Heath
Tetradico +90° +180° +270°
- FFD10B
Happy Face
- 00F7DF
≈ Bright Aqua
- C8D4FF
≈ Pale Phthalo Blue
- FFC3D2
≈ Garden Glory
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.46:1 · APCA Lc 22
Ag
AAASu nero
WCAG 14.37:1 · APCA Lc 82
Miglior colore del testo: #000000
WCAG 14.37:1 (AAA) · APCA Lc 82
Contrast pairs
Frammenti di codice
CSS
:root {
--happy-face: #ffd10b;
--happy-face-rgb: 255 209 11;
--happy-face-oklch: oklch(0.875 0.178 92.5);
}
.element {
color: var(--happy-face);
background-color: hsl(49 100% 52%);
border-color: oklch(0.875 0.178 92.5);
}Tailwind CSS v4
@theme {
--color-happy-face: #ffd10b;
--color-happy-face-50: #fff5bb;
--color-happy-face-100: #fbe8a3;
--color-happy-face-200: #ecd378;
--color-happy-face-300: #d5b538;
--color-happy-face-400: #c39900;
--color-happy-face-500: #b07e00;
--color-happy-face-600: #946b00;
--color-happy-face-700: #775500;
--color-happy-face-800: #5a3d00;
--color-happy-face-900: #3f2a00;
--color-happy-face-950: #281700;
}SCSS
$happy-face: #ffd10b;
$happy-face-rgb: 255, 209, 11;
$happy-face-light: mix(#fff, $happy-face, 20%);
$happy-face-dark: mix(#000, $happy-face, 20%);
.element {
color: $happy-face;
box-shadow: 0 0 0 2px rgba($happy-face, 0.35);
}