Color con nombre · #EFCF98
Sparkling Champagne
Sparkling Champagne es #EFCF98: rgb(239 207 152), hsl(38 73% 77%), oklch(0.869 0.08 80.8). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Orange mean? → · Sparkling Champagne color name →
#EFCF98
oklch(0.869 0.08 80.8)
Conversiones de color
- HEX
- #efcf98
- RGB
- rgb(239 207 152)
- HSL
- hsl(38 73% 77%)
- HWB
- hwb(38 60% 6%)
- OKLCH
- oklch(0.869 0.08 80.8)
- OKLab
- oklab(0.869 0.013 0.079)
- CIE Lab
- lab(84.91 6.03 31.75)
- LCH
- lch(84.91 32.32 79.3)
- CMYK
- cmyk(0% 13% 36% 6%)
Tintes · Sombras · Tonos
Tintes
- F1D4A3
- F2D9AD
- F4DEB8
- F6E2C2
- F7E7CC
- F9ECD6
- FAF1E1
- FCF6EB
- FDFAF5
Sombras
- D0B484
- B19970
- 947F5C
- 78674A
- 5C4F38
- 423827
- 2A2317
- 141008
- 030201
Tonos
- E3C796
- D8BF94
- CDB792
- C1AF90
- B6A78D
- AB9F8B
- A09788
- 958F86
- 8B8883
Armonías de color
Complementario +180°
- EFCF98
Sparkling Champagne
- BCD5FF
≈ Ice Cold Stare
Análogo -30° +30°
- EFCF98
Sparkling Champagne
- FFC6A5
≈ Bright Citrus
- D6D99C
≈ Liminality
Triádico +120° +240°
- EFCF98
Sparkling Champagne
- 93E4E9
≈ Aqua Fiesta
- ECC3F4
≈ Purple’s Baby Sister
Complementario dividido +150° +210°
- EFCF98
Sparkling Champagne
- 9DDEFF
≈ Columbia Blue
- D3CDFF
≈ Lavender Blue
Tetrádico +90° +180° +270°
- EFCF98
Sparkling Champagne
- 9EE5CD
≈ Aqua Wish
- BCD5FF
≈ Ice Cold Stare
- FEBFDA
≈ Cotton Candy
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.49:1 · APCA Lc 23
Ag
AAASobre negro
WCAG 14.04:1 · APCA Lc 80
Mejor color de texto: #000000
WCAG 14.04:1 (AAA) · APCA Lc 80
Contrast pairs
Fragmentos de código
CSS
:root {
--sparkling-champagne: #efcf98;
--sparkling-champagne-rgb: 239 207 152;
--sparkling-champagne-oklch: oklch(0.869 0.08 80.8);
}
.element {
color: var(--sparkling-champagne);
background-color: hsl(38 73% 77%);
border-color: oklch(0.869 0.08 80.8);
}Tailwind CSS v4
@theme {
--color-sparkling-champagne: #efcf98;
--color-sparkling-champagne-50: #fff4dc;
--color-sparkling-champagne-100: #f5e6cb;
--color-sparkling-champagne-200: #e5d2ae;
--color-sparkling-champagne-300: #cbb489;
--color-sparkling-champagne-400: #b79a67;
--color-sparkling-champagne-500: #a18045;
--color-sparkling-champagne-600: #886d3b;
--color-sparkling-champagne-700: #6d572f;
--color-sparkling-champagne-800: #513f21;
--color-sparkling-champagne-900: #392b16;
--color-sparkling-champagne-950: #231907;
}SCSS
$sparkling-champagne: #efcf98;
$sparkling-champagne-rgb: 239, 207, 152;
$sparkling-champagne-light: mix(#fff, $sparkling-champagne, 20%);
$sparkling-champagne-dark: mix(#000, $sparkling-champagne, 20%);
.element {
color: $sparkling-champagne;
box-shadow: 0 0 0 2px rgba($sparkling-champagne, 0.35);
}