Benannte Farbe · #FFDFB0
Champagne Orange
Champagne Orange ist #FFDFB0: rgb(255 223 176), hsl(36 100% 85%), oklch(0.919 0.07 77.2). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Champagne Orange color name →
#FFDFB0
oklch(0.919 0.07 77.2)
Farbumrechnungen
- HEX
- #ffdfb0
- RGB
- rgb(255 223 176)
- HSL
- hsl(36 100% 85%)
- HWB
- hwb(36 69% 0%)
- OKLCH
- oklch(0.919 0.07 77.2)
- OKLab
- oklab(0.919 0.016 0.069)
- CIE Lab
- lab(90.68 6.52 27.4)
- LCH
- lch(90.68 28.16 76.6)
- CMYK
- cmyk(0% 13% 31% 0%)
Tints · Shades · Tones
Tints
- FFE2B8
- FFE6C0
- FFE9C8
- FFECD0
- FFEFD8
- FFF2E0
- FFF6E8
- FFF9EF
- FFFCF7
Shades
- DEC299
- BEA582
- 9E8A6C
- 806F56
- 635642
- 483D2E
- 2E271C
- 16120B
- 030201
Tones
- F2D5AB
- E4CBA7
- D7C2A2
- CAB89D
- BEAF99
- B1A594
- A59C8F
- 98928A
- 8C8985
Farbharmonien
Komplementär +180°
- FFDFB0
Champagne Orange
- D4E6FF
≈ Veiling Waterfalls
Analog -30° +30°
- FFDFB0
Champagne Orange
- FFDCCB
≈ Glazed Sugar
- E9E8B2
≈ Steamy Dumpling
Triadisch +120° +240°
- FFDFB0
Champagne Orange
- ACF3F4
≈ Waterspout
- F5D9FF
≈ Lavender Savour
Geteilt komplementär +150° +210°
- FFDFB0
Champagne Orange
- C2ECFF
≈ Blue Java Banana
- E2E1FF
≈ Stoic White
Tetradisch +90° +180° +270°
- FFDFB0
Champagne Orange
- B7F4DB
≈ Seafair Green
- D4E6FF
≈ Veiling Waterfalls
- FFD7EB
≈ Pink Currant
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.27:1 · APCA Lc 14
Ag
AAAAuf Schwarz
WCAG 16.43:1 · APCA Lc 90
Beste Textfarbe: #000000
WCAG 16.43:1 (AAA) · APCA Lc 90
Contrast pairs
Code-Snippets
CSS
:root {
--champagne-orange: #ffdfb0;
--champagne-orange-rgb: 255 223 176;
--champagne-orange-oklch: oklch(0.919 0.07 77.2);
}
.element {
color: var(--champagne-orange);
background-color: hsl(36 100% 85%);
border-color: oklch(0.919 0.07 77.2);
}Tailwind CSS v4
@theme {
--color-champagne-orange: #ffdfb0;
--color-champagne-orange-50: #fff3df;
--color-champagne-orange-100: #f5e6ce;
--color-champagne-orange-200: #e5d1b3;
--color-champagne-orange-300: #cbb48f;
--color-champagne-orange-400: #b69a6f;
--color-champagne-orange-500: #a0804f;
--color-champagne-orange-600: #886d44;
--color-champagne-orange-700: #6d5736;
--color-champagne-orange-800: #513f26;
--color-champagne-orange-900: #382b19;
--color-champagne-orange-950: #23190a;
}SCSS
$champagne-orange: #ffdfb0;
$champagne-orange-rgb: 255, 223, 176;
$champagne-orange-light: mix(#fff, $champagne-orange, 20%);
$champagne-orange-dark: mix(#000, $champagne-orange, 20%);
.element {
color: $champagne-orange;
box-shadow: 0 0 0 2px rgba($champagne-orange, 0.35);
}