Color con nombre · #EDD69D
Palm Sugar Yellow
Palm Sugar Yellow es #EDD69D: rgb(237 214 157), hsl(43 69% 77%), oklch(0.882 0.078 88.6). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Yellow mean? → · Palm Sugar Yellow color name →
#EDD69D
oklch(0.882 0.078 88.6)
Conversiones de color
- HEX
- #edd69d
- RGB
- rgb(237 214 157)
- HSL
- hsl(43 69% 77%)
- HWB
- hwb(43 62% 7%)
- OKLCH
- oklch(0.882 0.078 88.6)
- OKLab
- oklab(0.882 0.002 0.078)
- CIE Lab
- lab(86.55 2.26 31.29)
- LCH
- lch(86.55 31.37 85.9)
- CMYK
- cmyk(0% 10% 34% 7%)
Tintes · Sombras · Tonos
Tintes
- EFDAA7
- F1DEB1
- F2E2BB
- F4E7C5
- F6EBCF
- F8EFD8
- FAF3E2
- FBF7EC
- FDFBF5
Sombras
- CEBA88
- B09E73
- 93845F
- 776A4C
- 5C523A
- 423B28
- 2A2518
- 141009
- 030201
Tonos
- E2CD9B
- D6C498
- CBBC95
- C0B393
- B5AA90
- AAA28D
- 9F998A
- 959187
- 8A8883
Armonías de color
Complementario +180°
- EDD69D
Palm Sugar Yellow
- C8D7FF
≈ Pale Phthalo Blue
Análogo -30° +30°
- EDD69D
Palm Sugar Yellow
- FFCCA6
≈ Light Saffron Orange
- D2E0A6
≈ Lime Cream
Triádico +120° +240°
- EDD69D
Palm Sugar Yellow
- 9AE7F3
≈ Blizzard Blue
- F5C6F2
≈ Purple’s Baby Sister
Complementario dividido +150° +210°
- EDD69D
Palm Sugar Yellow
- B1DFFF
≈ Droplet
- DDCFFF
≈ Pale Lavender
Tetrádico +90° +180° +270°
- EDD69D
Palm Sugar Yellow
- 9FE9D8
≈ Oasis Stream
- C8D7FF
≈ Pale Phthalo Blue
- FFC6D7
≈ Sweet Serenade
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.42:1 · APCA Lc 21
Ag
AAASobre negro
WCAG 14.70:1 · APCA Lc 83
Mejor color de texto: #000000
WCAG 14.70:1 (AAA) · APCA Lc 83
Contrast pairs
Fragmentos de código
CSS
:root {
--palm-sugar-yellow: #edd69d;
--palm-sugar-yellow-rgb: 237 214 157;
--palm-sugar-yellow-oklch: oklch(0.882 0.078 88.6);
}
.element {
color: var(--palm-sugar-yellow);
background-color: hsl(43 69% 77%);
border-color: oklch(0.882 0.078 88.6);
}Tailwind CSS v4
@theme {
--color-palm-sugar-yellow: #edd69d;
--color-palm-sugar-yellow-50: #fdf5dd;
--color-palm-sugar-yellow-100: #f2e7cb;
--color-palm-sugar-yellow-200: #e1d4af;
--color-palm-sugar-yellow-300: #c6b68a;
--color-palm-sugar-yellow-400: #b19c68;
--color-palm-sugar-yellow-500: #9b8346;
--color-palm-sugar-yellow-600: #836f3c;
--color-palm-sugar-yellow-700: #695930;
--color-palm-sugar-yellow-800: #4e4121;
--color-palm-sugar-yellow-900: #362d16;
--color-palm-sugar-yellow-950: #211907;
}SCSS
$palm-sugar-yellow: #edd69d;
$palm-sugar-yellow-rgb: 237, 214, 157;
$palm-sugar-yellow-light: mix(#fff, $palm-sugar-yellow, 20%);
$palm-sugar-yellow-dark: mix(#000, $palm-sugar-yellow, 20%);
.element {
color: $palm-sugar-yellow;
box-shadow: 0 0 0 2px rgba($palm-sugar-yellow, 0.35);
}