Nazwany kolor · #B0D8E7
Blue Refrain
Blue Refrain to #B0D8E7: rgb(176 216 231), hsl(196 53% 80%), oklch(0.858 0.047 222.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Cyan mean? → · Blue Refrain color name →
#B0D8E7
oklch(0.858 0.047 222.7)
Konwersje koloru
- HEX
- #b0d8e7
- RGB
- rgb(176 216 231)
- HSL
- hsl(196 53% 80%)
- HWB
- hwb(196 69% 9%)
- OKLCH
- oklch(0.858 0.047 222.7)
- OKLab
- oklab(0.858 -0.034 -0.032)
- CIE Lab
- lab(83.83 -11.12 -11.97)
- LCH
- lch(83.83 16.34 227.1)
- CMYK
- cmyk(24% 6% 0% 9%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- B8DCE9
- C0E0EC
- C8E4EE
- D0E8F1
- D8ECF3
- E0EFF5
- E7F3F8
- EFF7FA
- F7FBFD
Odcienie ciemniejsze
- 99BCC9
- 82A0AB
- 6C858F
- 566B73
- 425359
- 2E3B40
- 1C2528
- 0B1113
- 010203
Tony
- ABCFDC
- A7C6D2
- A2BDC7
- 9DB4BD
- 98ABB2
- 93A2A8
- 8F9A9E
- 8A9194
- 85888A
Harmonie kolorów
Komplementarna +180°
- B0D8E7
Blue Refrain
- ECC7B9
≈ Renaissance Fresco
Analogowa -30° +30°
- B0D8E7
Blue Refrain
- AEDBD9
≈ Beachside Drive
- BBD3EF
≈ Summer Birthday
Triada +120° +240°
- B0D8E7
Blue Refrain
- E7C5D9
≈ Dreamy Memory
- D6D2AF
≈ Chinese Silk
Komplementarna rozszczepiona +150° +210°
- B0D8E7
Blue Refrain
- EEC5C8
≈ Rose Aspect
- E4CCAF
≈ Jacobean Lace
Tetrada +90° +180° +270°
- B0D8E7
Blue Refrain
- DBC8E7
≈ Purity
- ECC7B9
≈ Renaissance Fresco
- C5D8B8
≈ Spice Garden
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.51:1 · APCA Lc 24
Ag
AAANa czerni
WCAG 13.82:1 · APCA Lc 79
Najlepszy kolor tekstu: #000000
WCAG 13.82:1 (AAA) · APCA Lc 79
Contrast pairs
Fragmenty kodu
CSS
:root {
--blue-refrain: #b0d8e7;
--blue-refrain-rgb: 176 216 231;
--blue-refrain-oklch: oklch(0.858 0.047 222.7);
}
.element {
color: var(--blue-refrain);
background-color: hsl(196 53% 80%);
border-color: oklch(0.858 0.047 222.7);
}Tailwind CSS v4
@theme {
--color-blue-refrain: #b0d8e7;
--color-blue-refrain-50: #e8f8ff;
--color-blue-refrain-100: #d8ecf4;
--color-blue-refrain-200: #c0d9e3;
--color-blue-refrain-300: #9fbdca;
--color-blue-refrain-400: #81a5b3;
--color-blue-refrain-500: #638e9d;
--color-blue-refrain-600: #557885;
--color-blue-refrain-700: #43606a;
--color-blue-refrain-800: #30464e;
--color-blue-refrain-900: #213136;
--color-blue-refrain-950: #101d21;
}SCSS
$blue-refrain: #b0d8e7;
$blue-refrain-rgb: 176, 216, 231;
$blue-refrain-light: mix(#fff, $blue-refrain, 20%);
$blue-refrain-dark: mix(#000, $blue-refrain, 20%);
.element {
color: $blue-refrain;
box-shadow: 0 0 0 2px rgba($blue-refrain, 0.35);
}