Color con nombre · #AEC9DC
Whiting Cottage
Whiting Cottage es #AEC9DC: rgb(174 201 220), hsl(205 40% 77%), oklch(0.822 0.04 238.7). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Blue mean? → · Whiting Cottage color name →
#AEC9DC
oklch(0.822 0.04 238.7)
Conversiones de color
- HEX
- #aec9dc
- RGB
- rgb(174 201 220)
- HSL
- hsl(205 40% 77%)
- HWB
- hwb(205 68% 14%)
- OKLCH
- oklch(0.822 0.04 238.7)
- OKLab
- oklab(0.822 -0.021 -0.034)
- CIE Lab
- lab(79.4 -6.35 -12.69)
- LCH
- lch(79.4 14.2 243.4)
- CMYK
- cmyk(21% 9% 0% 14%)
Tintes · Sombras · Tonos
Tintes
- B6CEE0
- BED4E3
- C6D9E7
- CEDEEA
- D6E4EE
- DEE9F1
- E6EFF5
- EFF4F8
- F7FAFC
Sombras
- 97AEBF
- 8095A3
- 6A7C88
- 55646E
- 414C54
- 2E363C
- 1C2226
- 0B0F11
- 010202
Tonos
- A9C1D2
- A5BAC9
- A0B3C0
- 9CABB6
- 97A4AD
- 929DA4
- 8E959B
- 898E92
- 858789
Armonías de color
Complementario +180°
- AEC9DC
Whiting Cottage
- D9BFAC
≈ Tagsale Linen
Análogo -30° +30°
- AEC9DC
Whiting Cottage
- A8CCD2
≈ Grand Entrance
- BAC4DF
≈ Etherium Blue
Triádico +120° +240°
- AEC9DC
Whiting Cottage
- DCBBC4
≈ Fragrant Orchid
- C2C9AC
≈ Desert Hot Springs
Complementario dividido +150° +210°
- AEC9DC
Whiting Cottage
- DDBCB6
≈ Strawflower
- CFC4A8
≈ Cyrus Grass
Tetrádico +90° +180° +270°
- AEC9DC
Whiting Cottage
- D4BCD2
≈ Cosmetic Mauve
- D9BFAC
≈ Tagsale Linen
- B4CCB7
≈ Subtle Green
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.72:1 · APCA Lc 31
Ag
AAASobre negro
WCAG 12.18:1 · APCA Lc 72
Mejor color de texto: #000000
WCAG 12.18:1 (AAA) · APCA Lc 72
Contrast pairs
Fragmentos de código
CSS
:root {
--whiting-cottage: #aec9dc;
--whiting-cottage-rgb: 174 201 220;
--whiting-cottage-oklch: oklch(0.822 0.04 238.7);
}
.element {
color: var(--whiting-cottage);
background-color: hsl(205 40% 77%);
border-color: oklch(0.822 0.04 238.7);
}Tailwind CSS v4
@theme {
--color-whiting-cottage: #aec9dc;
--color-whiting-cottage-50: #ecf7ff;
--color-whiting-cottage-100: #ddeaf4;
--color-whiting-cottage-200: #c6d7e4;
--color-whiting-cottage-300: #a6bbca;
--color-whiting-cottage-400: #8aa2b4;
--color-whiting-cottage-500: #6e8a9e;
--color-whiting-cottage-600: #5e7585;
--color-whiting-cottage-700: #4b5e6b;
--color-whiting-cottage-800: #36454e;
--color-whiting-cottage-900: #242f37;
--color-whiting-cottage-950: #131c21;
}SCSS
$whiting-cottage: #aec9dc;
$whiting-cottage-rgb: 174, 201, 220;
$whiting-cottage-light: mix(#fff, $whiting-cottage, 20%);
$whiting-cottage-dark: mix(#000, $whiting-cottage, 20%);
.element {
color: $whiting-cottage;
box-shadow: 0 0 0 2px rgba($whiting-cottage, 0.35);
}