Colore con nome · #DE9D7C
Ciao
Ciao è #DE9D7C: rgb(222 157 124), hsl(20 60% 68%), oklch(0.751 0.09 47.8). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Ciao color name →
#DE9D7C
oklch(0.751 0.09 47.8)
Conversioni di colore
- HEX
- #de9d7c
- RGB
- rgb(222 157 124)
- HSL
- hsl(20 60% 68%)
- HWB
- hwb(20 49% 13%)
- OKLCH
- oklch(0.751 0.09 47.8)
- OKLab
- oklab(0.751 0.061 0.067)
- CIE Lab
- lab(70.63 22.11 27.45)
- LCH
- lch(70.63 35.25 51.2)
- CMYK
- cmyk(0% 29% 44% 13%)
Tinte · Ombre · Toni
Tinte
- E2A789
- E6B196
- E9BAA3
- EDC4B0
- F0CEBD
- F3D8CA
- F7E1D7
- F9EBE4
- FCF5F2
Ombre
- C1886B
- A5735A
- 895F4A
- 6F4C3B
- 553A2C
- 3D281E
- 261811
- 120905
- 020101
Toni
- D59A7D
- CB987E
- C2957E
- B8927F
- AF8F7F
- A68C80
- 9C8980
- 938680
- 898380
Armonie di colore
Complementare +180°
- DE9D7C
Ciao
- 6CBADB
≈ Clear Weather
Analogo -30° +30°
- DE9D7C
Ciao
- E29799
≈ Marker Pink
- CEA76B
≈ Campground
Triadico +120° +240°
Complementare divisa +150° +210°
- DE9D7C
Ciao
- 60C0C3
≈ Gem Turquoise
- 8AB0E8
≈ Queer Blue
Tetradico +90° +180° +270°
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 2.27:1 · APCA Lc 45
Ag
AAASu nero
WCAG 9.21:1 · APCA Lc 57
Miglior colore del testo: #000000
WCAG 9.21:1 (AAA) · APCA Lc 57
Contrast pairs
Frammenti di codice
CSS
:root {
--ciao: #de9d7c;
--ciao-rgb: 222 157 124;
--ciao-oklch: oklch(0.751 0.09 47.8);
}
.element {
color: var(--ciao);
background-color: hsl(20 60% 68%);
border-color: oklch(0.751 0.09 47.8);
}Tailwind CSS v4
@theme {
--color-ciao: #de9d7c;
--color-ciao-50: #ffeedf;
--color-ciao-100: #ffe0ce;
--color-ciao-200: #f5cab2;
--color-ciao-300: #deaa8e;
--color-ciao-400: #cb8e6f;
--color-ciao-500: #b7734f;
--color-ciao-600: #9a6144;
--color-ciao-700: #7c4e36;
--color-ciao-800: #5c3827;
--color-ciao-900: #41261a;
--color-ciao-950: #29140b;
}SCSS
$ciao: #de9d7c;
$ciao-rgb: 222, 157, 124;
$ciao-light: mix(#fff, $ciao, 20%);
$ciao-dark: mix(#000, $ciao, 20%);
.element {
color: $ciao;
box-shadow: 0 0 0 2px rgba($ciao, 0.35);
}