Color con nombre · #E7D791
Pineapple Slice
Pineapple Slice es #E7D791: rgb(231 215 145), hsl(49 64% 74%), oklch(0.876 0.091 96.8). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Yellow mean? → · Pineapple Slice color name →
#E7D791
oklch(0.876 0.091 96.8)
Conversiones de color
- HEX
- #e7d791
- RGB
- rgb(231 215 145)
- HSL
- hsl(49 64% 74%)
- HWB
- hwb(49 57% 9%)
- OKLCH
- oklch(0.876 0.091 96.8)
- OKLab
- oklab(0.876 -0.011 0.09)
- CIE Lab
- lab(86.11 -1.58 36.67)
- LCH
- lch(86.11 36.7 92.5)
- CMYK
- cmyk(0% 7% 37% 9%)
Tintes · Sombras · Tonos
Tintes
- E9DB9D
- ECDFA8
- EEE3B3
- F0E7BE
- F3EBC9
- F5EFD4
- F8F3DF
- FAF7EA
- FDFBF4
Sombras
- C9BB7D
- AB9F6A
- 8F8558
- 736B46
- 595235
- 403B25
- 282515
- 131107
- 030201
Tonos
- DCCE90
- D1C58F
- C7BC8E
- BCB48C
- B2AB8A
- A8A289
- 9E9A87
- 949185
- 8A8882
Armonías de color
Complementario +180°
- E7D791
Pineapple Slice
- CBD3FF
≈ Pale Phthalo Blue
Análogo -30° +30°
- E7D791
Pineapple Slice
- FFCB96
≈ Tangerine Silk
- C6E2A1
≈ Cactus Spike
Triádico +120° +240°
- E7D791
Pineapple Slice
- 8DE6FD
≈ Winter Wizard
- FEC0EC
≈ Pretty in Pink
Complementario dividido +150° +210°
- E7D791
Pineapple Slice
- B5DBFF
≈ Broad Daylight
- E3C9FF
≈ Foggy Heath
Tetrádico +90° +180° +270°
- E7D791
Pineapple Slice
- 8CEAE0
≈ Bath Water
- CBD3FF
≈ Pale Phthalo Blue
- FFC4CF
≈ Cotton Candy Comet
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.44:1 · APCA Lc 21
Ag
AAASobre negro
WCAG 14.52:1 · APCA Lc 82
Mejor color de texto: #000000
WCAG 14.52:1 (AAA) · APCA Lc 82
Contrast pairs
Fragmentos de código
CSS
:root {
--pineapple-slice: #e7d791;
--pineapple-slice-rgb: 231 215 145;
--pineapple-slice-oklch: oklch(0.876 0.091 96.8);
}
.element {
color: var(--pineapple-slice);
background-color: hsl(49 64% 74%);
border-color: oklch(0.876 0.091 96.8);
}Tailwind CSS v4
@theme {
--color-pineapple-slice: #e7d791;
--color-pineapple-slice-50: #fbf6d9;
--color-pineapple-slice-100: #efe9c7;
--color-pineapple-slice-200: #ded6a9;
--color-pineapple-slice-300: #c3b983;
--color-pineapple-slice-400: #ae9f5e;
--color-pineapple-slice-500: #978638;
--color-pineapple-slice-600: #807231;
--color-pineapple-slice-700: #665b27;
--color-pineapple-slice-800: #4c421a;
--color-pineapple-slice-900: #352d11;
--color-pineapple-slice-950: #201a04;
}SCSS
$pineapple-slice: #e7d791;
$pineapple-slice-rgb: 231, 215, 145;
$pineapple-slice-light: mix(#fff, $pineapple-slice, 20%);
$pineapple-slice-dark: mix(#000, $pineapple-slice, 20%);
.element {
color: $pineapple-slice;
box-shadow: 0 0 0 2px rgba($pineapple-slice, 0.35);
}