Colore con nome · #AF9770
Trench
Trench è #AF9770: rgb(175 151 112), hsl(37 28% 56%), oklch(0.688 0.061 79.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Trench color name →
#AF9770
oklch(0.688 0.061 79.5)
Conversioni di colore
- HEX
- #af9770
- RGB
- rgb(175 151 112)
- HSL
- hsl(37 28% 56%)
- HWB
- hwb(37 44% 31%)
- OKLCH
- oklch(0.688 0.061 79.5)
- OKLab
- oklab(0.688 0.011 0.06)
- CIE Lab
- lab(63.92 5 24.07)
- LCH
- lch(63.92 24.58 78.3)
- CMYK
- cmyk(0% 14% 36% 31%)
Tinte · Ombre · Toni
Tinte
- B7A17E
- BFAB8C
- C7B59A
- CFC0A8
- D7CAB6
- DFD5C5
- E7DFD3
- EFEAE2
- F7F4F0
Ombre
- 988360
- 816F51
- 6B5C43
- 564935
- 413727
- 2E261A
- 1C170E
- 0B0804
- 010101
Toni
- AA9572
- A69374
- A19076
- 9C8E77
- 978C79
- 93897B
- 8E877C
- 89857D
- 85827F
Armonie di colore
Complementare +180°
- AF9770
Trench
- 859CC1
≈ Manifest Destiny
Analogo -30° +30°
- AF9770
Trench
- BA907A
≈ Mojave Dusk
- 9D9E73
≈ Pine Trail
Triadico +120° +240°
- AF9770
Trench
- 6CA7A9
≈ Fairstar
- AC8FB3
≈ Superstitious
Complementare divisa +150° +210°
- AF9770
Trench
- 73A2B9
≈ Grey Blue
- 9995BF
≈ Lavender Bonnet
Tetradico +90° +180° +270°
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 2.80:1 · APCA Lc 54
Ag
AAASu nero
WCAG 7.48:1 · APCA Lc 48
Miglior colore del testo: #000000
WCAG 7.48:1 (AAA) · APCA Lc 48
Contrast pairs
Frammenti di codice
CSS
:root {
--trench: #af9770;
--trench-rgb: 175 151 112;
--trench-oklch: oklch(0.688 0.061 79.5);
}
.element {
color: var(--trench);
background-color: hsl(37 28% 56%);
border-color: oklch(0.688 0.061 79.5);
}Tailwind CSS v4
@theme {
--color-trench: #af9770;
--color-trench-50: #fef4e2;
--color-trench-100: #f2e6d2;
--color-trench-200: #e2d2b8;
--color-trench-300: #c7b595;
--color-trench-400: #b29b76;
--color-trench-500: #9c8257;
--color-trench-600: #846e4a;
--color-trench-700: #69583b;
--color-trench-800: #4e402a;
--color-trench-900: #362c1c;
--color-trench-950: #21190c;
}SCSS
$trench: #af9770;
$trench-rgb: 175, 151, 112;
$trench-light: mix(#fff, $trench, 20%);
$trench-dark: mix(#000, $trench, 20%);
.element {
color: $trench;
box-shadow: 0 0 0 2px rgba($trench, 0.35);
}