Named color · #DDC3A4
Louvre
Louvre is #DDC3A4: rgb(221 195 164), hsl(33 46% 75%), oklch(0.831 0.051 71.9). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Louvre color name →
#DDC3A4
oklch(0.831 0.051 71.9)
Color conversions
- HEX
- #ddc3a4
- RGB
- rgb(221 195 164)
- HSL
- hsl(33 46% 75%)
- HWB
- hwb(33 64% 13%)
- OKLCH
- oklch(0.831 0.051 71.9)
- OKLab
- oklab(0.831 0.016 0.049)
- CIE Lab
- lab(80.44 6.04 19.19)
- LCH
- lch(80.44 20.12 72.5)
- CMYK
- cmyk(0% 12% 26% 13%)
Tints · Shades · Tones
Tints
- E0C9AD
- E4CFB6
- E7D5BF
- EBDBC8
- EEE1D1
- F2E7DA
- F5EDE3
- F8F3ED
- FCF9F6
Shades
- C0A98E
- A49079
- 887864
- 6E6050
- 554A3D
- 3D342B
- 26201A
- 110E0A
- 020201
Tones
- D3BCA0
- CAB59D
- C0AE99
- B7A896
- AEA192
- A49A8F
- 9B948B
- 928D87
- 898784
Color harmonies
Complementary +180°
- DDC3A4
Louvre
- B0CBE9
≈ Featherbed
Analogous -30° +30°
- DDC3A4
Louvre
- E6BEAE
≈ Adorable
- CEC9A4
≈ Frozen Dew
Triadic +120° +240°
- DDC3A4
Louvre
- A2D3D0
≈ Crystal Aqua
- D3BFE0
≈ Purple Whisper
Split-complementary +150° +210°
- DDC3A4
Louvre
- A4D0E0
≈ Sea Rover
- C2C4E9
≈ Violet Gems
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 1.69:1 · APCA Lc 30
Ag
AAAOn black
WCAG 12.41:1 · APCA Lc 73
Best text color: #000000
WCAG 12.41:1 (AAA) · APCA Lc 73
Contrast pairs
Code snippets
CSS
:root {
--louvre: #ddc3a4;
--louvre-rgb: 221 195 164;
--louvre-oklch: oklch(0.831 0.051 71.9);
}
.element {
color: var(--louvre);
background-color: hsl(33 46% 75%);
border-color: oklch(0.831 0.051 71.9);
}Tailwind CSS v4
@theme {
--color-louvre: #ddc3a4;
--color-louvre-50: #fef3e6;
--color-louvre-100: #f2e6d6;
--color-louvre-200: #e2d2bd;
--color-louvre-300: #c8b49b;
--color-louvre-400: #b29a7e;
--color-louvre-500: #9c8161;
--color-louvre-600: #846d52;
--color-louvre-700: #695741;
--color-louvre-800: #4e3f2f;
--color-louvre-900: #362c20;
--color-louvre-950: #21190f;
}SCSS
$louvre: #ddc3a4;
$louvre-rgb: 221, 195, 164;
$louvre-light: mix(#fff, $louvre, 20%);
$louvre-dark: mix(#000, $louvre, 20%);
.element {
color: $louvre;
box-shadow: 0 0 0 2px rgba($louvre, 0.35);
}