Color con nombre · #B2CFD3
Clinical Soft Blue
Clinical Soft Blue es #B2CFD3: rgb(178 207 211), hsl(187 27% 76%), oklch(0.834 0.032 206.7). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Gray mean? → · Clinical Soft Blue color name →
#B2CFD3
oklch(0.834 0.032 206.7)
Conversiones de color
- HEX
- #b2cfd3
- RGB
- rgb(178 207 211)
- HSL
- hsl(187 27% 76%)
- HWB
- hwb(187 70% 17%)
- OKLCH
- oklch(0.834 0.032 206.7)
- OKLab
- oklab(0.834 -0.028 -0.014)
- CIE Lab
- lab(81.06 -9.41 -5.43)
- LCH
- lch(81.06 10.86 210)
- CMYK
- cmyk(16% 2% 0% 17%)
Tintes · Sombras · Tonos
Tintes
- BAD4D7
- C1D9DC
- C9DDE0
- D1E2E4
- D8E7E9
- E0ECED
- E8F0F2
- EFF5F6
- F7FAFB
Sombras
- 9AB4B7
- 83999C
- 6D7F82
- 576769
- 434F51
- 2F383A
- 1D2324
- 0C1010
- 010202
Tonos
- ADC7CA
- A8BFC2
- A3B7B9
- 9EAFB1
- 99A7A9
- 949FA0
- 8F9798
- 8A8F90
- 858888
Armonías de color
Complementario +180°
- B2CFD3
Clinical Soft Blue
- DDC1BE
≈ Slubbed Silk
Análogo -30° +30°
- B2CFD3
Clinical Soft Blue
- B4D0C8
≈ Uninhibited
- B6CCDB
≈ Wondrous Blue
Triádico +120° +240°
- B2CFD3
Clinical Soft Blue
- D4C2D4
≈ Seedless Grape
- D2C8B2
≈ Kitsilano Cookie
Complementario dividido +150° +210°
- B2CFD3
Clinical Soft Blue
- DBC1C9
≈ Baby Tone
- D9C4B5
≈ Mission Stone
Tetrádico +90° +180° +270°
- B2CFD3
Clinical Soft Blue
- CAC5DB
≈ Lilac Crystal
- DDC1BE
≈ Slubbed Silk
- C7CCB5
≈ Only Olive
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.64:1 · APCA Lc 29
Ag
AAASobre negro
WCAG 12.75:1 · APCA Lc 74
Mejor color de texto: #000000
WCAG 12.75:1 (AAA) · APCA Lc 74
Contrast pairs
Fragmentos de código
CSS
:root {
--clinical-soft-blue: #b2cfd3;
--clinical-soft-blue-rgb: 178 207 211;
--clinical-soft-blue-oklch: oklch(0.834 0.032 206.7);
}
.element {
color: var(--clinical-soft-blue);
background-color: hsl(187 27% 76%);
border-color: oklch(0.834 0.032 206.7);
}Tailwind CSS v4
@theme {
--color-clinical-soft-blue: #b2cfd3;
--color-clinical-soft-blue-50: #ebf8fa;
--color-clinical-soft-blue-100: #ddebed;
--color-clinical-soft-blue-200: #c6d8db;
--color-clinical-soft-blue-300: #a6bcc0;
--color-clinical-soft-blue-400: #8aa4a8;
--color-clinical-soft-blue-500: #6e8c91;
--color-clinical-soft-blue-600: #5e777a;
--color-clinical-soft-blue-700: #4b5f62;
--color-clinical-soft-blue-800: #364647;
--color-clinical-soft-blue-900: #253031;
--color-clinical-soft-blue-950: #131c1d;
}SCSS
$clinical-soft-blue: #b2cfd3;
$clinical-soft-blue-rgb: 178, 207, 211;
$clinical-soft-blue-light: mix(#fff, $clinical-soft-blue, 20%);
$clinical-soft-blue-dark: mix(#000, $clinical-soft-blue, 20%);
.element {
color: $clinical-soft-blue;
box-shadow: 0 0 0 2px rgba($clinical-soft-blue, 0.35);
}