Cor nomeada · #FFC900
Sunny Summer
Sunny Summer é #FFC900: rgb(255 201 0), hsl(47 100% 50%), oklch(0.859 0.176 89). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · Sunny Summer color name →
#FFC900
oklch(0.859 0.176 89)
Conversões de cor
- HEX
- #ffc900
- RGB
- rgb(255 201 0)
- HSL
- hsl(47 100% 50%)
- HWB
- hwb(47 0% 0%)
- OKLCH
- oklch(0.859 0.176 89)
- OKLab
- oklab(0.859 0.003 0.176)
- CIE Lab
- lab(84.03 9.71 84.32)
- LCH
- lch(84.03 84.88 83.4)
- CMYK
- cmyk(0% 21% 100% 0%)
Tons claros · Sombras · Tons
Tons claros
- FFCF43
- FFD561
- FFDB7A
- FFE090
- FFE6A4
- FFEBB7
- FFF0CA
- FFF5DC
- FFFAED
Sombras
- DEAE00
- BE9500
- 9E7C00
- 806400
- 634C00
- 483600
- 2E2200
- 160F00
- 030200
Tons
- F2C231
- E5BB44
- D8B452
- CBAC5D
- BEA565
- B19E6C
- A59673
- 988F78
- 8C887C
Harmonias de cor
Complementar +180°
- FFC900
Sunny Summer
- BED0FF
≈ Ice Cold Stare
Análoga -30° +30°
- FFC900
Sunny Summer
- FFC293
≈ Wispy White
- C5E047
≈ Greenivorous
Tríade +120° +240°
- FFC900
Sunny Summer
- 48E8FF
≈ Shimmering Expanse Cyan
- FFB2FA
≈ Strawberry Buttercream
Complementar dividida +150° +210°
- FFC900
Sunny Summer
- A1D9FF
≈ Malmö FF
- D8C6FF
≈ Neon Boneyard
Tétrade +90° +180° +270°
- FFC900
Sunny Summer
- 00F2D3
≈ Frozen Boubble
- BED0FF
≈ Ice Cold Stare
- FFBBCF
≈ Tentacle Pink
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.54:1 · APCA Lc 25
Ag
AAASobre preto
WCAG 13.60:1 · APCA Lc 78
Melhor cor de texto: #000000
WCAG 13.60:1 (AAA) · APCA Lc 78
Contrast pairs
Trechos de código
CSS
:root {
--sunny-summer: #ffc900;
--sunny-summer-rgb: 255 201 0;
--sunny-summer-oklch: oklch(0.859 0.176 89);
}
.element {
color: var(--sunny-summer);
background-color: hsl(47 100% 50%);
border-color: oklch(0.859 0.176 89);
}Tailwind CSS v4
@theme {
--color-sunny-summer: #ffc900;
--color-sunny-summer-50: #fff4bc;
--color-sunny-summer-100: #fee6a4;
--color-sunny-summer-200: #f0d279;
--color-sunny-summer-300: #d9b33a;
--color-sunny-summer-400: #c89600;
--color-sunny-summer-500: #b57b00;
--color-sunny-summer-600: #986800;
--color-sunny-summer-700: #7a5300;
--color-sunny-summer-800: #5c3c00;
--color-sunny-summer-900: #412900;
--color-sunny-summer-950: #291600;
}SCSS
$sunny-summer: #ffc900;
$sunny-summer-rgb: 255, 201, 0;
$sunny-summer-light: mix(#fff, $sunny-summer, 20%);
$sunny-summer-dark: mix(#000, $sunny-summer, 20%);
.element {
color: $sunny-summer;
box-shadow: 0 0 0 2px rgba($sunny-summer, 0.35);
}