Nazwany kolor · #D3E7E9
Bravo Blue
Bravo Blue to #D3E7E9: rgb(211 231 233), hsl(185 33% 87%), oklch(0.914 0.021 204). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Bravo Blue color name →
#D3E7E9
oklch(0.914 0.021 204)
Konwersje koloru
- HEX
- #d3e7e9
- RGB
- rgb(211 231 233)
- HSL
- hsl(185 33% 87%)
- HWB
- hwb(185 83% 9%)
- OKLCH
- oklch(0.914 0.021 204)
- OKLab
- oklab(0.914 -0.02 -0.009)
- CIE Lab
- lab(90.19 -6.57 -3.36)
- LCH
- lch(90.19 7.38 207.1)
- CMYK
- cmyk(9% 1% 0% 9%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D7E9EB
- DCECED
- E0EEF0
- E5F1F2
- E9F3F4
- EDF5F6
- F2F8F8
- F6FAFB
- FBFDFD
Odcienie ciemniejsze
- B7C9CB
- 9CABAD
- 828F90
- 697374
- 51595A
- 3A4041
- 242829
- 101313
- 020303
Tony
- CADCDE
- C2D2D3
- B9C7C8
- B1BDBE
- A9B2B3
- A0A8A9
- 989E9E
- 909494
- 888A8A
Harmonie kolorów
Komplementarna +180°
- D3E7E9
Bravo Blue
- F1DDDC
≈ Butterfly Kisses
Analogowa -30° +30°
- D3E7E9
Bravo Blue
- D5E7E1
≈ Echo
- D5E5EF
≈ Snowdrift Glow
Triada +120° +240°
- D3E7E9
Bravo Blue
- EADEEB
≈ Sprinkle
- E9E2D3
≈ Elk Horn
Komplementarna rozszczepiona +150° +210°
- D3E7E9
Bravo Blue
- EFDDE3
≈ Dream State
- EFDFD6
≈ Heavenly Aromas
Tetrada +90° +180° +270°
- D3E7E9
Bravo Blue
- E3E0F0
≈ Velvet Scarf
- F1DDDC
≈ Butterfly Kisses
- E2E4D4
≈ Yoga Daze
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.28:1 · APCA Lc 14
Ag
AAANa czerni
WCAG 16.37:1 · APCA Lc 90
Najlepszy kolor tekstu: #000000
WCAG 16.37:1 (AAA) · APCA Lc 90
Contrast pairs
Fragmenty kodu
CSS
:root {
--bravo-blue: #d3e7e9;
--bravo-blue-rgb: 211 231 233;
--bravo-blue-oklch: oklch(0.914 0.021 204);
}
.element {
color: var(--bravo-blue);
background-color: hsl(185 33% 87%);
border-color: oklch(0.914 0.021 204);
}Tailwind CSS v4
@theme {
--color-bravo-blue: #d3e7e9;
--color-bravo-blue-50: #eef7f8;
--color-bravo-blue-100: #e0eaeb;
--color-bravo-blue-200: #cad7d9;
--color-bravo-blue-300: #abbbbd;
--color-bravo-blue-400: #90a2a4;
--color-bravo-blue-500: #768b8d;
--color-bravo-blue-600: #647577;
--color-bravo-blue-700: #505e5f;
--color-bravo-blue-800: #3a4545;
--color-bravo-blue-900: #282f30;
--color-bravo-blue-950: #161c1c;
}SCSS
$bravo-blue: #d3e7e9;
$bravo-blue-rgb: 211, 231, 233;
$bravo-blue-light: mix(#fff, $bravo-blue, 20%);
$bravo-blue-dark: mix(#000, $bravo-blue, 20%);
.element {
color: $bravo-blue;
box-shadow: 0 0 0 2px rgba($bravo-blue, 0.35);
}