Cor nomeada · #DEC569
California Dreaming
California Dreaming é #DEC569: rgb(222 197 105), hsl(47 64% 64%), oklch(0.826 0.116 94.5). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · California Dreaming color name →
#DEC569
oklch(0.826 0.116 94.5)
Conversões de cor
- HEX
- #dec569
- RGB
- rgb(222 197 105)
- HSL
- hsl(47 64% 64%)
- HWB
- hwb(47 41% 13%)
- OKLCH
- oklch(0.826 0.116 94.5)
- OKLab
- oklab(0.826 -0.009 0.116)
- CIE Lab
- lab(80.26 0.71 48.94)
- LCH
- lch(80.26 48.95 89.2)
- CMYK
- cmyk(0% 11% 53% 13%)
Tons claros · Sombras · Tons
Tons claros
- E1CB7A
- E5D18A
- E8D799
- EBDDA8
- EEE2B7
- F2E8C6
- F5EED4
- F8F4E2
- FCF9F1
Sombras
- C1AB5A
- A5924C
- 89793E
- 6F6131
- 554B24
- 3D3518
- 26210C
- 120E04
- 020200
Tons
- D4BE6D
- CAB771
- C1B074
- B7A977
- AEA279
- A49C7B
- 9B957D
- 928E7E
- 89877F
Harmonias de cor
Complementar +180°
- DEC569
California Dreaming
- B5C2FF
≈ Dried Lilac
Análoga -30° +30°
- DEC569
California Dreaming
- FAB673
≈ Jambalaya
- B5D37E
≈ Tart Apple
Tríade +120° +240°
- DEC569
California Dreaming
- 5CD9F4
≈ Electric Lemonade
- F5A9E4
≈ Hanami Pink
Complementar dividida +150° +210°
- DEC569
California Dreaming
- 91CDFF
≈ Clear Sky
- D6B4FF
≈ Light Violet
Tétrade +90° +180° +270°
- DEC569
California Dreaming
- 5DDECF
≈ Jazzy Jade
- B5C2FF
≈ Dried Lilac
- FFAABE
≈ A Brand New Day
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.70:1 · APCA Lc 31
Ag
AAASobre preto
WCAG 12.29:1 · APCA Lc 72
Melhor cor de texto: #000000
WCAG 12.29:1 (AAA) · APCA Lc 72
Contrast pairs
Trechos de código
CSS
:root {
--california-dreaming: #dec569;
--california-dreaming-rgb: 222 197 105;
--california-dreaming-oklch: oklch(0.826 0.116 94.5);
}
.element {
color: var(--california-dreaming);
background-color: hsl(47 64% 64%);
border-color: oklch(0.826 0.116 94.5);
}Tailwind CSS v4
@theme {
--color-california-dreaming: #dec569;
--color-california-dreaming-50: #fef6d1;
--color-california-dreaming-100: #f3e9bd;
--color-california-dreaming-200: #e2d59c;
--color-california-dreaming-300: #c8b871;
--color-california-dreaming-400: #b49d46;
--color-california-dreaming-500: #9f8400;
--color-california-dreaming-600: #86700a;
--color-california-dreaming-700: #6c5909;
--color-california-dreaming-800: #504104;
--color-california-dreaming-900: #382d04;
--color-california-dreaming-950: #231900;
}SCSS
$california-dreaming: #dec569;
$california-dreaming-rgb: 222, 197, 105;
$california-dreaming-light: mix(#fff, $california-dreaming, 20%);
$california-dreaming-dark: mix(#000, $california-dreaming, 20%);
.element {
color: $california-dreaming;
box-shadow: 0 0 0 2px rgba($california-dreaming, 0.35);
}