Colore con nome · #885522
Precious Copper
Precious Copper è #885522: rgb(136 85 34), hsl(30 60% 33%), oklch(0.497 0.094 62.3). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Brown mean? → · Precious Copper color name →
#885522
oklch(0.497 0.094 62.3)
Conversioni di colore
- HEX
- #885522
- RGB
- rgb(136 85 34)
- HSL
- hsl(30 60% 33%)
- HWB
- hwb(30 13% 47%)
- OKLCH
- oklch(0.497 0.094 62.3)
- OKLab
- oklab(0.497 0.044 0.083)
- CIE Lab
- lab(41.35 18.44 37.66)
- LCH
- lch(41.35 41.94 63.9)
- CMYK
- cmyk(0% 38% 75% 47%)
Tinte · Ombre · Toni
Tinte
- 94653A
- A07550
- AC8665
- B8977A
- C4A890
- D0B9A5
- DCCABB
- E7DBD1
- F3EDE8
Ombre
- 75491C
- 633D16
- 523111
- 41260B
- 311C07
- 221103
- 130801
- 060200
- 010000
Toni
- 885A2E
- 875E39
- 876343
- 86674C
- 856B55
- 85705E
- 847466
- 83786F
- 817C78
Armonie di colore
Complementare +180°
- 885522
Precious Copper
- 296893
≈ Starry Night
Analogo -30° +30°
- 885522
Precious Copper
- 904D3F
≈ New Brick
- 756013
≈ Brassy Brass
Triadico +120° +240°
- 885522
Precious Copper
- 007367
≈ Pharaoh’s Gem
- 6D558F
≈ Pure Mauve
Complementare divisa +150° +210°
- 885522
Precious Copper
- 006F7F
≈ Coastal Jetty
- 505E98
≈ Royal Marquis
Tetradico +90° +180° +270°
- 885522
Precious Copper
- 327247
≈ Felt
- 296893
≈ Starry Night
- 824D7A
≈ Thistle Mauve
Contrasto e accessibilità
Ag
AASu bianco
WCAG 6.23:1 · APCA Lc 81
Ag
FailSu nero
WCAG 3.36:1 · APCA Lc 21
Miglior colore del testo: #FFFFFF
WCAG 6.23:1 (AA) · APCA Lc 81
Contrast pairs
Frammenti di codice
CSS
:root {
--precious-copper: #885522;
--precious-copper-rgb: 136 85 34;
--precious-copper-oklch: oklch(0.497 0.094 62.3);
}
.element {
color: var(--precious-copper);
background-color: hsl(30 60% 33%);
border-color: oklch(0.497 0.094 62.3);
}Tailwind CSS v4
@theme {
--color-precious-copper: #885522;
--color-precious-copper-50: #fff0da;
--color-precious-copper-100: #ffe2c8;
--color-precious-copper-200: #f1cdab;
--color-precious-copper-300: #daae85;
--color-precious-copper-400: #c79263;
--color-precious-copper-500: #b2773f;
--color-precious-copper-600: #976537;
--color-precious-copper-700: #79512b;
--color-precious-copper-800: #5a3a1e;
--color-precious-copper-900: #3f2814;
--color-precious-copper-950: #281606;
}SCSS
$precious-copper: #885522;
$precious-copper-rgb: 136, 85, 34;
$precious-copper-light: mix(#fff, $precious-copper, 20%);
$precious-copper-dark: mix(#000, $precious-copper, 20%);
.element {
color: $precious-copper;
box-shadow: 0 0 0 2px rgba($precious-copper, 0.35);
}