Named color · #AEC6CF
Roquefort Blue
Roquefort Blue is #AEC6CF: rgb(174 198 207), hsl(196 26% 75%), oklch(0.811 0.029 222.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Roquefort Blue color name →
#AEC6CF
oklch(0.811 0.029 222.4)
Color conversions
- HEX
- #aec6cf
- RGB
- rgb(174 198 207)
- HSL
- hsl(196 26% 75%)
- HWB
- hwb(196 68% 19%)
- OKLCH
- oklch(0.811 0.029 222.4)
- OKLab
- oklab(0.811 -0.021 -0.02)
- CIE Lab
- lab(78.28 -7.01 -7.41)
- LCH
- lch(78.28 10.2 226.6)
- CMYK
- cmyk(16% 4% 0% 19%)
Tints · Shades · Tones
Tints
- B6CCD4
- BED1D8
- C6D7DD
- CEDDE2
- D6E2E7
- DEE8EC
- E6EEF0
- EFF3F5
- F7F9FA
Shades
- 97ACB4
- 809299
- 6A7A7F
- 556267
- 414B4F
- 2E3538
- 1C2123
- 0B0E10
- 010202
Tones
- A9BFC7
- A5B8BF
- A0B0B7
- 9CA9AF
- 97A2A7
- 929B9F
- 8E9497
- 898E8F
- 858788
Color harmonies
Complementary +180°
- AEC6CF
Roquefort Blue
- D3BCB3
≈ Badlands Taupe
Analogous -30° +30°
- AEC6CF
Roquefort Blue
- ADC8C6
≈ Seaport Steam
- B4C3D4
≈ Elevated
Triadic +120° +240°
- AEC6CF
Roquefort Blue
- CFBAC6
≈ Rose Marble
- C5C2AD
≈ Brown Buzz
Split-complementary +150° +210°
- AEC6CF
Roquefort Blue
- D3BABC
≈ Mediterranean Sunset
- CDBFAD
≈ Sandbar
Tetradic +90° +180° +270°
- AEC6CF
Roquefort Blue
- C8BCCF
≈ Purpling Dawn
- D3BCB3
≈ Badlands Taupe
- BAC6B3
≈ Komorebi
Contrast & accessibility
Ag
FailOn white
WCAG 1.78:1 · APCA Lc 33
Ag
AAAOn black
WCAG 11.77:1 · APCA Lc 70
Best text color: #000000
WCAG 11.77:1 (AAA) · APCA Lc 70
Contrast pairs
Code snippets
CSS
:root {
--roquefort-blue: #aec6cf;
--roquefort-blue-rgb: 174 198 207;
--roquefort-blue-oklch: oklch(0.811 0.029 222.4);
}
.element {
color: var(--roquefort-blue);
background-color: hsl(196 26% 75%);
border-color: oklch(0.811 0.029 222.4);
}Tailwind CSS v4
@theme {
--color-roquefort-blue: #aec6cf;
--color-roquefort-blue-50: #edf7fb;
--color-roquefort-blue-100: #deeaef;
--color-roquefort-blue-200: #c8d7de;
--color-roquefort-blue-300: #a8bbc3;
--color-roquefort-blue-400: #8da3ab;
--color-roquefort-blue-500: #728b94;
--color-roquefort-blue-600: #61767d;
--color-roquefort-blue-700: #4d5e64;
--color-roquefort-blue-800: #384549;
--color-roquefort-blue-900: #263033;
--color-roquefort-blue-950: #141c1f;
}SCSS
$roquefort-blue: #aec6cf;
$roquefort-blue-rgb: 174, 198, 207;
$roquefort-blue-light: mix(#fff, $roquefort-blue, 20%);
$roquefort-blue-dark: mix(#000, $roquefort-blue, 20%);
.element {
color: $roquefort-blue;
box-shadow: 0 0 0 2px rgba($roquefort-blue, 0.35);
}