Colore con nome · #9BBCE4
Gallery Blue
Gallery Blue è #9BBCE4: rgb(155 188 228), hsl(213 57% 75%), oklch(0.785 0.068 253.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Gallery Blue color name →
#9BBCE4
oklch(0.785 0.068 253.5)
Conversioni di colore
- HEX
- #9bbce4
- RGB
- rgb(155 188 228)
- HSL
- hsl(213 57% 75%)
- HWB
- hwb(213 61% 11%)
- OKLCH
- oklch(0.785 0.068 253.5)
- OKLab
- oklab(0.785 -0.019 -0.065)
- CIE Lab
- lab(74.85 -4.47 -23.94)
- LCH
- lch(74.85 24.35 259.4)
- CMYK
- cmyk(32% 18% 0% 11%)
Tinte · Ombre · Toni
Tinte
- A5C3E7
- AFC9EA
- B9D0ED
- C3D7EF
- CCDDF2
- D7E4F5
- E1EBF7
- EBF2FA
- F5F8FD
Ombre
- 86A3C6
- 728BA9
- 5E738D
- 4B5D72
- 394758
- 28323F
- 181F28
- 090D12
- 010203
Toni
- 98B6DA
- 96B0CF
- 93AAC5
- 91A4BB
- 8E9EB1
- 8B98A7
- 88929D
- 868C93
- 83868A
Armonie di colore
Complementare +180°
- 9BBCE4
Gallery Blue
- D4B389
≈ Summerwood
Analogo -30° +30°
- 9BBCE4
Gallery Blue
- 89C3D9
≈ Dolphin
- B3B4E4
≈ Beloved
Triadico +120° +240°
- 9BBCE4
Gallery Blue
- E1A8AC
≈ Raspberry Lemonade
- A8C397
≈ Heartland Frosty
Complementare divisa +150° +210°
- 9BBCE4
Gallery Blue
- DFAC96
≈ Arizona Dust
- C0BB89
≈ Goody Two Shoes
Tetradico +90° +180° +270°
- 9BBCE4
Gallery Blue
- D9A8C4
≈ Lofty Delight
- D4B389
≈ Summerwood
- 91C7AD
≈ Hellion Green
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.96:1 · APCA Lc 38
Ag
AAASu nero
WCAG 10.70:1 · APCA Lc 65
Miglior colore del testo: #000000
WCAG 10.70:1 (AAA) · APCA Lc 65
Contrast pairs
Frammenti di codice
CSS
:root {
--gallery-blue: #9bbce4;
--gallery-blue-rgb: 155 188 228;
--gallery-blue-oklch: oklch(0.785 0.068 253.5);
}
.element {
color: var(--gallery-blue);
background-color: hsl(213 57% 75%);
border-color: oklch(0.785 0.068 253.5);
}Tailwind CSS v4
@theme {
--color-gallery-blue: #9bbce4;
--color-gallery-blue-50: #e9f7ff;
--color-gallery-blue-100: #d9e9ff;
--color-gallery-blue-200: #c2d6f1;
--color-gallery-blue-300: #a1bada;
--color-gallery-blue-400: #83a1c6;
--color-gallery-blue-500: #6689b2;
--color-gallery-blue-600: #577497;
--color-gallery-blue-700: #455d79;
--color-gallery-blue-800: #314459;
--color-gallery-blue-900: #212f3e;
--color-gallery-blue-950: #101b28;
}SCSS
$gallery-blue: #9bbce4;
$gallery-blue-rgb: 155, 188, 228;
$gallery-blue-light: mix(#fff, $gallery-blue, 20%);
$gallery-blue-dark: mix(#000, $gallery-blue, 20%);
.element {
color: $gallery-blue;
box-shadow: 0 0 0 2px rgba($gallery-blue, 0.35);
}