Cor nomeada · #AEBBC1
Blue Heather
Blue Heather é #AEBBC1: rgb(174 187 193), hsl(199 13% 72%), oklch(0.784 0.017 227). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Blue Heather color name →
#AEBBC1
oklch(0.784 0.017 227)
Conversões de cor
- HEX
- #aebbc1
- RGB
- rgb(174 187 193)
- HSL
- hsl(199 13% 72%)
- HWB
- hwb(199 68% 24%)
- OKLCH
- oklch(0.784 0.017 227)
- OKLab
- oklab(0.784 -0.011 -0.012)
- CIE Lab
- lab(75 -3.76 -4.67)
- LCH
- lch(75 5.99 231.2)
- CMYK
- cmyk(10% 3% 0% 24%)
Tons claros · Sombras · Tons
Tons claros
- B6C2C7
- BEC8CD
- C6CFD3
- CED6D9
- D6DDE0
- DEE3E6
- E6EAEC
- EEF1F2
- F7F8F9
Sombras
- 97A2A7
- 808A8F
- 6A7377
- 555C5F
- 414649
- 2E3234
- 1C1F20
- 0B0D0E
- 010202
Tons
- A9B5BA
- A5AFB4
- A0A9AD
- 9BA3A6
- 979DA0
- 929799
- 8E9193
- 898B8D
- 858686
Harmonias de cor
Complementar +180°
- AEBBC1
Blue Heather
- C2B6B0
≈ Sand Ripples
Análoga -30° +30°
- AEBBC1
Blue Heather
- ADBCBC
≈ Watery
- B2B9C4
≈ Granite Fog
Tríade +120° +240°
- AEBBC1
Blue Heather
- C1B4BB
≈ Blossom Powder
- B9B9AD
≈ Zen Pebble
Complementar dividida +150° +210°
- AEBBC1
Blue Heather
- C3B5B5
≈ Young Fawn
- BFB7AD
≈ Row House
Tétrade +90° +180° +270°
- AEBBC1
Blue Heather
- BDB5C0
≈ Future Vision
- C2B6B0
≈ Sand Ripples
- B4BBB1
≈ Keystone Grey
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.96:1 · APCA Lc 38
Ag
AAASobre preto
WCAG 10.67:1 · APCA Lc 64
Melhor cor de texto: #000000
WCAG 10.67:1 (AAA) · APCA Lc 64
Contrast pairs
Trechos de código
CSS
:root {
--blue-heather: #aebbc1;
--blue-heather-rgb: 174 187 193;
--blue-heather-oklch: oklch(0.784 0.017 227);
}
.element {
color: var(--blue-heather);
background-color: hsl(199 13% 72%);
border-color: oklch(0.784 0.017 227);
}Tailwind CSS v4
@theme {
--color-blue-heather: #aebbc1;
--color-blue-heather-50: #f0f6f9;
--color-blue-heather-100: #e2e9ec;
--color-blue-heather-200: #cdd6da;
--color-blue-heather-300: #afb9be;
--color-blue-heather-400: #95a1a6;
--color-blue-heather-500: #7b898f;
--color-blue-heather-600: #687479;
--color-blue-heather-700: #535c61;
--color-blue-heather-800: #3c4447;
--color-blue-heather-900: #2a2f31;
--color-blue-heather-950: #171b1d;
}SCSS
$blue-heather: #aebbc1;
$blue-heather-rgb: 174, 187, 193;
$blue-heather-light: mix(#fff, $blue-heather, 20%);
$blue-heather-dark: mix(#000, $blue-heather, 20%);
.element {
color: $blue-heather;
box-shadow: 0 0 0 2px rgba($blue-heather, 0.35);
}