Benoemde kleur · #CDBB9C
Tumblin’ Tumbleweed
Tumblin’ Tumbleweed is #CDBB9C: rgb(205 187 156), hsl(38 33% 71%), oklch(0.799 0.047 81.3). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Orange mean? → · Tumblin’ Tumbleweed color name →
#CDBB9C
oklch(0.799 0.047 81.3)
Kleurconversies
- HEX
- #cdbb9c
- RGB
- rgb(205 187 156)
- HSL
- hsl(38 33% 71%)
- HWB
- hwb(38 61% 20%)
- OKLCH
- oklch(0.799 0.047 81.3)
- OKLab
- oklab(0.799 0.007 0.046)
- CIE Lab
- lab(76.81 3.01 18.21)
- LCH
- lch(76.81 18.46 80.6)
- CMYK
- cmyk(0% 9% 24% 20%)
Tinten · Schaduwen · Tonen
Tinten
- D2C2A6
- D7C8AF
- DCCFB9
- E1D6C3
- E6DDCD
- EBE3D7
- F0EAE1
- F5F1EB
- FAF8F5
Schaduwen
- B2A287
- 988A73
- 7E735F
- 665C4C
- 4E4639
- 383228
- 231F18
- 0F0D09
- 020201
Tonen
- C5B599
- BDAF97
- B5A994
- ADA391
- A69D8E
- 9E978B
- 969189
- 8F8C86
- 878683
Kleurharmonieën
Complementair +180°
- CDBB9C
Tumblin’ Tumbleweed
- ADBEDC
≈ Pigeon Post
Analoog -30° +30°
- CDBB9C
Tumblin’ Tumbleweed
- D7B6A3
≈ Sedona Pink
- BEC19F
≈ Chameleon Tango
Triadisch +120° +240°
- CDBB9C
Tumblin’ Tumbleweed
- 9BC7CA
≈ Continental Waters
- CCB4D0
≈ Elfin Herb
Gesplitst complementair +150° +210°
- CDBB9C
Tumblin’ Tumbleweed
- A0C4D7
≈ Blue Bows
- BDB9DA
≈ Playful Purple
Tetradisch +90° +180° +270°
- CDBB9C
Tumblin’ Tumbleweed
- A0C8BA
≈ Cool Juniper
- ADBEDC
≈ Pigeon Post
- D6B2C1
≈ Mauvelous
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.87:1 · APCA Lc 36
Ag
AAAOp zwart
WCAG 11.18:1 · APCA Lc 67
Beste tekstkleur: #000000
WCAG 11.18:1 (AAA) · APCA Lc 67
Contrast pairs
Codefragmenten
CSS
:root {
--tumblin-tumbleweed: #cdbb9c;
--tumblin-tumbleweed-rgb: 205 187 156;
--tumblin-tumbleweed-oklch: oklch(0.799 0.047 81.3);
}
.element {
color: var(--tumblin-tumbleweed);
background-color: hsl(38 33% 71%);
border-color: oklch(0.799 0.047 81.3);
}Tailwind CSS v4
@theme {
--color-tumblin-tumbleweed: #cdbb9c;
--color-tumblin-tumbleweed-50: #fcf4e6;
--color-tumblin-tumbleweed-100: #efe7d7;
--color-tumblin-tumbleweed-200: #ded3be;
--color-tumblin-tumbleweed-300: #c3b69d;
--color-tumblin-tumbleweed-400: #ad9c80;
--color-tumblin-tumbleweed-500: #968363;
--color-tumblin-tumbleweed-600: #7f6f54;
--color-tumblin-tumbleweed-700: #665943;
--color-tumblin-tumbleweed-800: #4b4130;
--color-tumblin-tumbleweed-900: #342d21;
--color-tumblin-tumbleweed-950: #201a10;
}SCSS
$tumblin-tumbleweed: #cdbb9c;
$tumblin-tumbleweed-rgb: 205, 187, 156;
$tumblin-tumbleweed-light: mix(#fff, $tumblin-tumbleweed, 20%);
$tumblin-tumbleweed-dark: mix(#000, $tumblin-tumbleweed, 20%);
.element {
color: $tumblin-tumbleweed;
box-shadow: 0 0 0 2px rgba($tumblin-tumbleweed, 0.35);
}