Color con nombre · #BCC5AA
Zion
Zion es #BCC5AA: rgb(188 197 170), hsl(80 19% 72%), oklch(0.809 0.038 122.3). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Yellow mean? → · Zion color name →
#BCC5AA
oklch(0.809 0.038 122.3)
Conversiones de color
- HEX
- #bcc5aa
- RGB
- rgb(188 197 170)
- HSL
- hsl(80 19% 72%)
- HWB
- hwb(80 67% 23%)
- OKLCH
- oklch(0.809 0.038 122.3)
- OKLab
- oklab(0.809 -0.02 0.032)
- CIE Lab
- lab(78.26 -6.79 12.49)
- LCH
- lch(78.26 14.22 118.5)
- CMYK
- cmyk(5% 0% 14% 23%)
Tintes · Sombras · Tonos
Tintes
- C3CBB2
- C9D0BB
- D0D6C3
- D6DCCB
- DDE2D4
- E4E8DC
- EAEDE5
- F1F3EE
- F8F9F6
Sombras
- A3AB93
- 8B927D
- 737968
- 5D6153
- 474B3F
- 32352D
- 1F211B
- 0D0E0B
- 020201
Tonos
- B6BEA6
- B0B7A2
- AAB09D
- A3A999
- 9DA295
- 979B91
- 92948D
- 8C8D88
- 868784
Armonías de color
Complementario +180°
- BCC5AA
Zion
- C5BBD6
≈ Pretty Purple
Análogo -30° +30°
- BCC5AA
Zion
- C9C0A5
≈ Country Charm
- AFC8B5
≈ Zanah
Triádico +120° +240°
- BCC5AA
Zion
- ACC4D8
≈ Blue Prism
- D7B7BE
≈ Nostalgia
Complementario dividido +150° +210°
Tetrádico +90° +180° +270°
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.79:1 · APCA Lc 33
Ag
AAASobre negro
WCAG 11.70:1 · APCA Lc 69
Mejor color de texto: #000000
WCAG 11.70:1 (AAA) · APCA Lc 69
Contrast pairs
Fragmentos de código
CSS
:root {
--zion: #bcc5aa;
--zion-rgb: 188 197 170;
--zion-oklch: oklch(0.809 0.038 122.3);
}
.element {
color: var(--zion);
background-color: hsl(80 19% 72%);
border-color: oklch(0.809 0.038 122.3);
}Tailwind CSS v4
@theme {
--color-zion: #bcc5aa;
--color-zion-50: #f3f7eb;
--color-zion-100: #e5eadd;
--color-zion-200: #d0d7c6;
--color-zion-300: #b3bba6;
--color-zion-400: #9aa28a;
--color-zion-500: #818b6f;
--color-zion-600: #6e755e;
--color-zion-700: #585e4b;
--color-zion-800: #404536;
--color-zion-900: #2c2f25;
--color-zion-950: #191c13;
}SCSS
$zion: #bcc5aa;
$zion-rgb: 188, 197, 170;
$zion-light: mix(#fff, $zion, 20%);
$zion-dark: mix(#000, $zion, 20%);
.element {
color: $zion;
box-shadow: 0 0 0 2px rgba($zion, 0.35);
}