Nazwany kolor · #F4E1C6
Champagne Toast
Champagne Toast to #F4E1C6: rgb(244 225 198), hsl(35 68% 87%), oklch(0.918 0.041 76.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Champagne Toast color name →
#F4E1C6
oklch(0.918 0.041 76.7)
Konwersje koloru
- HEX
- #f4e1c6
- RGB
- rgb(244 225 198)
- HSL
- hsl(35 68% 87%)
- HWB
- hwb(35 78% 4%)
- OKLCH
- oklch(0.918 0.041 76.7)
- OKLab
- oklab(0.918 0.009 0.04)
- CIE Lab
- lab(90.56 3.59 15.74)
- LCH
- lch(90.56 16.15 77.1)
- CMYK
- cmyk(0% 8% 19% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F5E4CC
- F6E7D1
- F7EAD7
- F8EDDD
- FAF0E3
- FBF3E8
- FCF6EE
- FDF9F4
- FEFCF9
Odcienie ciemniejsze
- D4C4AC
- B5A792
- 978B7A
- 7A7062
- 5E564B
- 443E35
- 2B2721
- 14120E
- 030202
Tony
- E8D7BF
- DCCDB8
- D0C3B1
- C4B9AA
- B8AFA3
- ADA69C
- A19C95
- 96938E
- 8B8987
Harmonie kolorów
Komplementarna +180°
- F4E1C6
Champagne Toast
- D3E6FF
≈ Veiling Waterfalls
Analogowa -30° +30°
- F4E1C6
Champagne Toast
- FDDCCD
≈ Glazed Sugar
- E7E6C7
≈ Child of Heaven
Triada +120° +240°
- F4E1C6
Champagne Toast
- C5EDED
≈ Morning Sky
- EFDCF7
≈ Grape Taffy
Komplementarna rozszczepiona +150° +210°
- F4E1C6
Champagne Toast
- C8EAFA
≈ Frosty Day
- E1E0FF
≈ Stoic White
Tetrada +90° +180° +270°
- F4E1C6
Champagne Toast
- CBEDDE
≈ Teal Melody
- D3E6FF
≈ Veiling Waterfalls
- FAD9E9
≈ Cherry Flower
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.27:1 · APCA Lc 14
Ag
AAANa czerni
WCAG 16.43:1 · APCA Lc 90
Najlepszy kolor tekstu: #000000
WCAG 16.43:1 (AAA) · APCA Lc 90
Contrast pairs
Fragmenty kodu
CSS
:root {
--champagne-toast: #f4e1c6;
--champagne-toast-rgb: 244 225 198;
--champagne-toast-oklch: oklch(0.918 0.041 76.7);
}
.element {
color: var(--champagne-toast);
background-color: hsl(35 68% 87%);
border-color: oklch(0.918 0.041 76.7);
}Tailwind CSS v4
@theme {
--color-champagne-toast: #f4e1c6;
--color-champagne-toast-50: #fcf4e8;
--color-champagne-toast-100: #f0e7d9;
--color-champagne-toast-200: #ded3c1;
--color-champagne-toast-300: #c3b5a0;
--color-champagne-toast-400: #ad9c84;
--color-champagne-toast-500: #968368;
--color-champagne-toast-600: #7f6f58;
--color-champagne-toast-700: #665946;
--color-champagne-toast-800: #4b4033;
--color-champagne-toast-900: #342c22;
--color-champagne-toast-950: #1f1911;
}SCSS
$champagne-toast: #f4e1c6;
$champagne-toast-rgb: 244, 225, 198;
$champagne-toast-light: mix(#fff, $champagne-toast, 20%);
$champagne-toast-dark: mix(#000, $champagne-toast, 20%);
.element {
color: $champagne-toast;
box-shadow: 0 0 0 2px rgba($champagne-toast, 0.35);
}