Nazwany kolor · #B6C7E0
Retina Soft Blue
Retina Soft Blue to #B6C7E0: rgb(182 199 224), hsl(216 40% 80%), oklch(0.825 0.04 257.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Blue mean? → · Retina Soft Blue color name →
#B6C7E0
oklch(0.825 0.04 257.9)
Konwersje koloru
- HEX
- #b6c7e0
- RGB
- rgb(182 199 224)
- HSL
- hsl(216 40% 80%)
- HWB
- hwb(216 71% 12%)
- OKLCH
- oklch(0.825 0.04 257.9)
- OKLab
- oklab(0.825 -0.008 -0.039)
- CIE Lab
- lab(79.54 -2.09 -14.55)
- LCH
- lch(79.54 14.7 261.8)
- CMYK
- cmyk(19% 11% 0% 12%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- BDCDE3
- C4D2E6
- CCD8E9
- D3DDED
- DAE3F0
- E1E8F3
- E9EEF6
- F0F4F9
- F8F9FC
Odcienie ciemniejsze
- 9EADC3
- 8693A6
- 6F7A8A
- 596270
- 444C56
- 30363E
- 1D2127
- 0C0E12
- 020202
Tony
- B0C0D6
- ABB8CC
- A6B1C2
- A0AAB9
- 9BA3AF
- 959CA5
- 90959C
- 8B8E93
- 858789
Harmonie kolorów
Komplementarna +180°
- B6C7E0
Retina Soft Blue
- D4C3A9
≈ Bleached Sand
Analogowa -30° +30°
- B6C7E0
Retina Soft Blue
- ACCBDA
≈ Sailing on the Bay
- C4C2DF
≈ Ice Mauve
Triada +120° +240°
- B6C7E0
Retina Soft Blue
- DFBCBC
≈ Fizzing Whizbees
- B9CCB3
≈ Succulent Garden
Komplementarna rozszczepiona +150° +210°
- B6C7E0
Retina Soft Blue
- DCBFB0
≈ One to Remember
- C8C8AB
≈ Desert Hot Springs
Tetrada +90° +180° +270°
- B6C7E0
Retina Soft Blue
- DABCCA
≈ Fragrant Orchid
- D4C3A9
≈ Bleached Sand
- AECEC1
≈ Watershed
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.71:1 · APCA Lc 31
Ag
AAANa czerni
WCAG 12.23:1 · APCA Lc 72
Najlepszy kolor tekstu: #000000
WCAG 12.23:1 (AAA) · APCA Lc 72
Contrast pairs
Fragmenty kodu
CSS
:root {
--retina-soft-blue: #b6c7e0;
--retina-soft-blue-rgb: 182 199 224;
--retina-soft-blue-oklch: oklch(0.825 0.04 257.9);
}
.element {
color: var(--retina-soft-blue);
background-color: hsl(216 40% 80%);
border-color: oklch(0.825 0.04 257.9);
}Tailwind CSS v4
@theme {
--color-retina-soft-blue: #b6c7e0;
--color-retina-soft-blue-50: #eff6ff;
--color-retina-soft-blue-100: #e0e8f6;
--color-retina-soft-blue-200: #cad5e6;
--color-retina-soft-blue-300: #acb8cc;
--color-retina-soft-blue-400: #90a0b6;
--color-retina-soft-blue-500: #7687a1;
--color-retina-soft-blue-600: #647388;
--color-retina-soft-blue-700: #505c6d;
--color-retina-soft-blue-800: #394350;
--color-retina-soft-blue-900: #272e38;
--color-retina-soft-blue-950: #151b22;
}SCSS
$retina-soft-blue: #b6c7e0;
$retina-soft-blue-rgb: 182, 199, 224;
$retina-soft-blue-light: mix(#fff, $retina-soft-blue, 20%);
$retina-soft-blue-dark: mix(#000, $retina-soft-blue, 20%);
.element {
color: $retina-soft-blue;
box-shadow: 0 0 0 2px rgba($retina-soft-blue, 0.35);
}