Color con nombre · #558367
Verdigris Roundhead
Verdigris Roundhead es #558367: rgb(85 131 103), hsl(143 21% 42%), oklch(0.568 0.067 156.8). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Green mean? → · Verdigris Roundhead color name →
#558367
oklch(0.568 0.067 156.8)
Conversiones de color
- HEX
- #558367
- RGB
- rgb(85 131 103)
- HSL
- hsl(143 21% 42%)
- HWB
- hwb(143 33% 49%)
- OKLCH
- oklch(0.568 0.067 156.8)
- OKLab
- oklab(0.568 -0.061 0.026)
- CIE Lab
- lab(50.82 -21.26 9.99)
- LCH
- lch(50.82 23.49 154.8)
- CMYK
- cmyk(35% 0% 21% 49%)
Tintes · Sombras · Tonos
Tintes
- 668F75
- 769B84
- 87A792
- 97B3A1
- A8C0B0
- B9CCC0
- CAD9CF
- DCE5DF
- EDF2EF
Sombras
- 497159
- 3D604B
- 314F3D
- 263F30
- 1C2F23
- 112017
- 08120C
- 020604
- 000100
Tonos
- 5A836A
- 5F836C
- 63826F
- 688271
- 6C8274
- 708176
- 748179
- 78817B
- 7C807E
Armonías de color
Complementario +180°
- 558367
Verdigris Roundhead
- 916885
≈ Fruit of Passion
Análogo -30° +30°
- 558367
Verdigris Roundhead
- 6C7E53
≈ Mint Leaves
- 44847D
≈ Carlisle
Triádico +120° +240°
- 558367
Verdigris Roundhead
- 6C749E
≈ Bleached Denim
- 9A695B
≈ Western Red
Complementario dividido +150° +210°
- 558367
Verdigris Roundhead
- 816D96
≈ Ornate
- 996670
≈ Nouveau Rose
Tetrádico +90° +180° +270°
- 558367
Verdigris Roundhead
- 567B9C
≈ Glass Sapphire
- 916885
≈ Fruit of Passion
- 926F4C
≈ El Caramelo
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 4.34:1 · APCA Lc 70
Ag
AASobre negro
WCAG 4.82:1 · APCA Lc 32
Mejor color de texto: #000000
WCAG 4.82:1 (AA) · APCA Lc 32
Contrast pairs
Fragmentos de código
CSS
:root {
--verdigris-roundhead: #558367;
--verdigris-roundhead-rgb: 85 131 103;
--verdigris-roundhead-oklch: oklch(0.568 0.067 156.8);
}
.element {
color: var(--verdigris-roundhead);
background-color: hsl(143 21% 42%);
border-color: oklch(0.568 0.067 156.8);
}Tailwind CSS v4
@theme {
--color-verdigris-roundhead: #558367;
--color-verdigris-roundhead-50: #e6fbee;
--color-verdigris-roundhead-100: #d6efe0;
--color-verdigris-roundhead-200: #bdddca;
--color-verdigris-roundhead-300: #9bc2ab;
--color-verdigris-roundhead-400: #7eab8f;
--color-verdigris-roundhead-500: #609474;
--color-verdigris-roundhead-600: #527d63;
--color-verdigris-roundhead-700: #41644f;
--color-verdigris-roundhead-800: #2f4938;
--color-verdigris-roundhead-900: #203326;
--color-verdigris-roundhead-950: #0f1f15;
}SCSS
$verdigris-roundhead: #558367;
$verdigris-roundhead-rgb: 85, 131, 103;
$verdigris-roundhead-light: mix(#fff, $verdigris-roundhead, 20%);
$verdigris-roundhead-dark: mix(#000, $verdigris-roundhead, 20%);
.element {
color: $verdigris-roundhead;
box-shadow: 0 0 0 2px rgba($verdigris-roundhead, 0.35);
}