Color con nombre más cercano · #666D74
#666D74
Color con nombre más cercano: Beautiful Darkness
#666D74 (rgb(102 109 116), hsl(210 6% 43%), oklch(0.531 0.014 248.1)) se parece más al color con nombre Beautiful Darkness. Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
#666D74
oklch(0.531 0.014 248.1)
Conversiones de color
- HEX
- #666d74
- RGB
- rgb(102 109 116)
- HSL
- hsl(210 6% 43%)
- HWB
- hwb(210 40% 55%)
- OKLCH
- oklch(0.531 0.014 248.1)
- OKLab
- oklab(0.531 -0.005 -0.013)
- CIE Lab
- lab(45.6 -1.61 -4.88)
- LCH
- lch(45.6 5.14 251.8)
- CMYK
- cmyk(12% 6% 0% 55%)
Tintes · Sombras · Tonos
Tintes
- 747B81
- 83888E
- 91969C
- A0A5A9
- AFB3B7
- BFC2C5
- CFD1D3
- DFE0E2
- EFEFF0
Sombras
- 585E64
- 4A4F54
- 3C4145
- 2F3337
- 232629
- 17191B
- 0C0D0F
- 040405
- 000101
Tonos
- 696F75
- 6B7176
- 6E7378
- 707579
- 73767A
- 76787B
- 787A7C
- 7B7C7E
- 7D7E7F
Armonías de color
Complementario +180°
- 666D74
Beautiful Darkness
- 726B64
≈ Shot-Put
Análogo -30° +30°
- 666D74
Beautiful Darkness
- 646E72
≈ Batman
- 6A6B74
≈ Warpfiend Grey
Triádico +120° +240°
- 666D74
Beautiful Darkness
- 74696A
≈ Night Skyscraper
- 6A6E65
≈ Bonsai Trunk
Complementario dividido +150° +210°
- 666D74
Beautiful Darkness
- 746A66
≈ Warm Haze
- 6E6C63
≈ Thunderous
Tetrádico +90° +180° +270°
- 666D74
Beautiful Darkness
- 72696F
≈ Lythrum
- 726B64
≈ Shot-Put
- 666F69
≈ On the Moor
Contraste y accesibilidad
Ag
AASobre blanco
WCAG 5.24:1 · APCA Lc 76
Ag
FailSobre negro
WCAG 4.00:1 · APCA Lc 26
Mejor color de texto: #FFFFFF
WCAG 5.24:1 (AA) · APCA Lc 76
Contrast pairs
Fragmentos de código
CSS
:root {
--beautiful-darkness: #666d74;
--beautiful-darkness-rgb: 102 109 116;
--beautiful-darkness-oklch: oklch(0.531 0.014 248.1);
}
.element {
color: var(--beautiful-darkness);
background-color: hsl(210 6% 43%);
border-color: oklch(0.531 0.014 248.1);
}Tailwind CSS v4
@theme {
--color-beautiful-darkness: #666d74;
--color-beautiful-darkness-50: #f2f5f9;
--color-beautiful-darkness-100: #e4e8ec;
--color-beautiful-darkness-200: #d0d5da;
--color-beautiful-darkness-300: #b2b8be;
--color-beautiful-darkness-400: #989fa6;
--color-beautiful-darkness-500: #7f878f;
--color-beautiful-darkness-600: #6c7279;
--color-beautiful-darkness-700: #565b61;
--color-beautiful-darkness-800: #3f4347;
--color-beautiful-darkness-900: #2b2e31;
--color-beautiful-darkness-950: #181b1d;
}SCSS
$beautiful-darkness: #666d74;
$beautiful-darkness-rgb: 102, 109, 116;
$beautiful-darkness-light: mix(#fff, $beautiful-darkness, 20%);
$beautiful-darkness-dark: mix(#000, $beautiful-darkness, 20%);
.element {
color: $beautiful-darkness;
box-shadow: 0 0 0 2px rgba($beautiful-darkness, 0.35);
}