Color con nombre · #B3C3D4
Elevated
Elevated es #B3C3D4: rgb(179 195 212), hsl(211 28% 77%), oklch(0.81 0.03 249.8). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Elevated color name →
#B3C3D4
oklch(0.81 0.03 249.8)
Conversiones de color
- HEX
- #b3c3d4
- RGB
- rgb(179 195 212)
- HSL
- hsl(211 28% 77%)
- HWB
- hwb(211 70% 17%)
- OKLCH
- oklch(0.81 0.03 249.8)
- OKLab
- oklab(0.81 -0.01 -0.028)
- CIE Lab
- lab(77.96 -3.05 -10.5)
- LCH
- lch(77.96 10.94 253.8)
- CMYK
- cmyk(16% 8% 0% 17%)
Tintes · Sombras · Tonos
Tintes
- BAC9D8
- C2CFDD
- C9D5E1
- D1DBE5
- D9E1E9
- E0E7EE
- E8EDF2
- EFF3F6
- F7F9FB
Sombras
- 9BA9B8
- 84909D
- 6E7883
- 586069
- 434A51
- 2F343A
- 1D2024
- 0C0E10
- 010202
Tonos
- AEBCCB
- A9B5C3
- A3AEBA
- 9EA8B2
- 99A1A9
- 949AA1
- 8F9498
- 8A8D90
- 858688
Armonías de color
Complementario +180°
- B3C3D4
Elevated
- CEBEAD
≈ Mesa Tumbleweed
Análogo -30° +30°
- B3C3D4
Elevated
- ADC6CE
≈ Roquefort Blue
- BDBFD5
≈ Twilight Pearl
Triádico +120° +240°
- B3C3D4
Elevated
- D3BABD
≈ Mediterranean Sunset
- BBC5B1
≈ Komorebi
Complementario dividido +150° +210°
- B3C3D4
Elevated
- D3BBB3
≈ Forever Fairytale
- C5C2AC
≈ Brown Buzz
Tetrádico +90° +180° +270°
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.79:1 · APCA Lc 33
Ag
AAASobre negro
WCAG 11.67:1 · APCA Lc 69
Mejor color de texto: #000000
WCAG 11.67:1 (AAA) · APCA Lc 69
Contrast pairs
Fragmentos de código
CSS
:root {
--elevated: #b3c3d4;
--elevated-rgb: 179 195 212;
--elevated-oklch: oklch(0.81 0.03 249.8);
}
.element {
color: var(--elevated);
background-color: hsl(211 28% 77%);
border-color: oklch(0.81 0.03 249.8);
}Tailwind CSS v4
@theme {
--color-elevated: #b3c3d4;
--color-elevated-50: #eff6fe;
--color-elevated-100: #e1e9f2;
--color-elevated-200: #cbd5e1;
--color-elevated-300: #adb9c7;
--color-elevated-400: #92a0b0;
--color-elevated-500: #78889a;
--color-elevated-600: #657382;
--color-elevated-700: #515c68;
--color-elevated-800: #3a434c;
--color-elevated-900: #282f35;
--color-elevated-950: #161b20;
}SCSS
$elevated: #b3c3d4;
$elevated-rgb: 179, 195, 212;
$elevated-light: mix(#fff, $elevated, 20%);
$elevated-dark: mix(#000, $elevated, 20%);
.element {
color: $elevated;
box-shadow: 0 0 0 2px rgba($elevated, 0.35);
}