Benoemde kleur · #DEC29F
Slender Reed
Slender Reed is #DEC29F: rgb(222 194 159), hsl(33 49% 75%), oklch(0.829 0.057 73.1). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Orange mean? → · Slender Reed color name →
#DEC29F
oklch(0.829 0.057 73.1)
Kleurconversies
- HEX
- #dec29f
- RGB
- rgb(222 194 159)
- HSL
- hsl(33 49% 75%)
- HWB
- hwb(33 62% 13%)
- OKLCH
- oklch(0.829 0.057 73.1)
- OKLab
- oklab(0.829 0.016 0.054)
- CIE Lab
- lab(80.2 6.43 21.52)
- LCH
- lch(80.2 22.46 73.4)
- CMYK
- cmyk(0% 13% 28% 13%)
Tinten · Schaduwen · Tonen
Tinten
- E1C8A9
- E5CEB2
- E8D4BC
- EBDAC5
- EFE0CF
- F2E6D8
- F5EDE2
- F9F3EC
- FCF9F5
Schaduwen
- C1A88A
- A58F75
- 897761
- 6F604D
- 55493B
- 3D3429
- 262018
- 120E09
- 020201
Tonen
- D4BB9C
- CBB599
- C1AE96
- B7A793
- AEA190
- A59A8D
- 9B938A
- 928D86
- 898683
Kleurharmonieën
Complementair +180°
- DEC29F
Slender Reed
- AECAEC
≈ Tropical Blue
Analoog -30° +30°
- DEC29F
Slender Reed
- E8BCAA
≈ Orangery
- CDC99F
≈ Anjou Pear
Triadisch +120° +240°
- DEC29F
Slender Reed
- 9CD3D1
≈ Fountain City
- D4BDE2
≈ Plum Point
Gesplitst complementair +150° +210°
- DEC29F
Slender Reed
- 9FD0E2
≈ Light Sky Babe
- C1C3EC
≈ Violet Gems
Tetradisch +90° +180° +270°
- DEC29F
Slender Reed
- A6D3BD
≈ Flowering Cactus
- AECAEC
≈ Tropical Blue
- E2B9D1
≈ Eau de Rose
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.70:1 · APCA Lc 30
Ag
AAAOp zwart
WCAG 12.32:1 · APCA Lc 72
Beste tekstkleur: #000000
WCAG 12.32:1 (AAA) · APCA Lc 72
Contrast pairs
Codefragmenten
CSS
:root {
--slender-reed: #dec29f;
--slender-reed-rgb: 222 194 159;
--slender-reed-oklch: oklch(0.829 0.057 73.1);
}
.element {
color: var(--slender-reed);
background-color: hsl(33 49% 75%);
border-color: oklch(0.829 0.057 73.1);
}Tailwind CSS v4
@theme {
--color-slender-reed: #dec29f;
--color-slender-reed-50: #fff3e4;
--color-slender-reed-100: #f3e6d4;
--color-slender-reed-200: #e3d1ba;
--color-slender-reed-300: #c9b498;
--color-slender-reed-400: #b39a7a;
--color-slender-reed-500: #9d815c;
--color-slender-reed-600: #856d4e;
--color-slender-reed-700: #6b573e;
--color-slender-reed-800: #4f3f2d;
--color-slender-reed-900: #372c1e;
--color-slender-reed-950: #22190e;
}SCSS
$slender-reed: #dec29f;
$slender-reed-rgb: 222, 194, 159;
$slender-reed-light: mix(#fff, $slender-reed, 20%);
$slender-reed-dark: mix(#000, $slender-reed, 20%);
.element {
color: $slender-reed;
box-shadow: 0 0 0 2px rgba($slender-reed, 0.35);
}