Benoemde kleur · #DC9D8B
Medium Terracotta
Medium Terracotta is #DC9D8B: rgb(220 157 139), hsl(13 54% 70%), oklch(0.752 0.08 36.6). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Red mean? → · Medium Terracotta color name →
#DC9D8B
oklch(0.752 0.08 36.6)
Kleurconversies
- HEX
- #dc9d8b
- RGB
- rgb(220 157 139)
- HSL
- hsl(13 54% 70%)
- HWB
- hwb(13 55% 14%)
- OKLCH
- oklch(0.752 0.08 36.6)
- OKLab
- oklab(0.752 0.064 0.048)
- CIE Lab
- lab(70.64 22.52 19.28)
- LCH
- lch(70.64 29.65 40.6)
- CMYK
- cmyk(0% 29% 37% 14%)
Tinten · Schaduwen · Tonen
Tinten
- E0A796
- E4B0A2
- E8BAAD
- ECC4B9
- EFCEC4
- F3D7D0
- F6E1DB
- F9EBE7
- FCF5F3
Schaduwen
- BF8878
- A37366
- 885F54
- 6E4C43
- 543A32
- 3C2823
- 261814
- 110907
- 020101
Tonen
- D39A8A
- CA9789
- C09588
- B79287
- AE8F86
- A58C85
- 9C8984
- 938683
- 898381
Kleurharmonieën
Complementair +180°
- DC9D8B
Medium Terracotta
- 70BCD0
≈ Cologne
Analoog -30° +30°
- DC9D8B
Medium Terracotta
- DB9AA6
≈ Cherry Ice
- D2A578
≈ Mulled Spice
Triadisch +120° +240°
- DC9D8B
Medium Terracotta
- 84BE9A
≈ Garden Swing
- A1ABE2
≈ Maximum Blue Purple
Gesplitst complementair +150° +210°
- DC9D8B
Medium Terracotta
- 6FBFB7
≈ Tropic Tide
- 85B4DF
≈ Dun Morogh Blue
Tetradisch +90° +180° +270°
- DC9D8B
Medium Terracotta
- A1B881
≈ Mesclun Green
- 70BCD0
≈ Cologne
- BCA2D7
≈ Enchanted Lavender
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 2.27:1 · APCA Lc 45
Ag
AAAOp zwart
WCAG 9.23:1 · APCA Lc 57
Beste tekstkleur: #000000
WCAG 9.23:1 (AAA) · APCA Lc 57
Contrast pairs
Codefragmenten
CSS
:root {
--medium-terracotta: #dc9d8b;
--medium-terracotta-rgb: 220 157 139;
--medium-terracotta-oklch: oklch(0.752 0.08 36.6);
}
.element {
color: var(--medium-terracotta);
background-color: hsl(13 54% 70%);
border-color: oklch(0.752 0.08 36.6);
}Tailwind CSS v4
@theme {
--color-medium-terracotta: #dc9d8b;
--color-medium-terracotta-50: #ffeee5;
--color-medium-terracotta-100: #ffdfd5;
--color-medium-terracotta-200: #f4c9bc;
--color-medium-terracotta-300: #ddaa9a;
--color-medium-terracotta-400: #c98e7d;
--color-medium-terracotta-500: #b47360;
--color-medium-terracotta-600: #986152;
--color-medium-terracotta-700: #7a4e41;
--color-medium-terracotta-800: #5b382f;
--color-medium-terracotta-900: #402620;
--color-medium-terracotta-950: #281510;
}SCSS
$medium-terracotta: #dc9d8b;
$medium-terracotta-rgb: 220, 157, 139;
$medium-terracotta-light: mix(#fff, $medium-terracotta, 20%);
$medium-terracotta-dark: mix(#000, $medium-terracotta, 20%);
.element {
color: $medium-terracotta;
box-shadow: 0 0 0 2px rgba($medium-terracotta, 0.35);
}