Benannte Farbe · #B0C9CD
Floating Blue
Floating Blue ist #B0C9CD: rgb(176 201 205), hsl(188 22% 75%), oklch(0.818 0.028 208.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Floating Blue color name →
#B0C9CD
oklch(0.818 0.028 208.3)
Farbumrechnungen
- HEX
- #b0c9cd
- RGB
- rgb(176 201 205)
- HSL
- hsl(188 22% 75%)
- HWB
- hwb(188 69% 20%)
- OKLCH
- oklch(0.818 0.028 208.3)
- OKLab
- oklab(0.818 -0.024 -0.013)
- CIE Lab
- lab(79.17 -8.11 -5)
- LCH
- lch(79.17 9.53 211.7)
- CMYK
- cmyk(14% 2% 0% 20%)
Tints · Shades · Tones
Tints
- B8CED2
- C0D4D7
- C7D9DC
- CFDEE1
- D7E4E6
- DFE9EB
- E7EFF0
- EFF4F5
- F7FAFA
Shades
- 99AEB2
- 829598
- 6C7C7E
- 566466
- 424C4E
- 2E3638
- 1C2223
- 0B0F0F
- 010202
Tones
- ABC1C5
- A6BABD
- A2B3B5
- 9DABAD
- 98A4A6
- 939D9E
- 8E9596
- 8A8E8F
- 858787
Farbharmonien
Komplementär +180°
- B0C9CD
Floating Blue
- D5BDBA
≈ Salmon Smoke
Analog -30° +30°
- B0C9CD
Floating Blue
- B2CAC4
≈ Light Teal
- B4C7D4
≈ Celestyn
Triadisch +120° +240°
- B0C9CD
Floating Blue
- CEBECD
≈ My Mona
- CBC3B0
≈ Still Moment
Geteilt komplementär +150° +210°
- B0C9CD
Floating Blue
- D4BDC3
≈ Frosted Sugar
- D2C0B3
≈ Rabbit’s Foot
Tetradisch +90° +180° +270°
- B0C9CD
Floating Blue
- C5C0D4
≈ Estate Violet
- D5BDBA
≈ Salmon Smoke
- C2C6B3
≈ Haggis
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.73:1 · APCA Lc 32
Ag
AAAAuf Schwarz
WCAG 12.08:1 · APCA Lc 71
Beste Textfarbe: #000000
WCAG 12.08:1 (AAA) · APCA Lc 71
Contrast pairs
Code-Snippets
CSS
:root {
--floating-blue: #b0c9cd;
--floating-blue-rgb: 176 201 205;
--floating-blue-oklch: oklch(0.818 0.028 208.3);
}
.element {
color: var(--floating-blue);
background-color: hsl(188 22% 75%);
border-color: oklch(0.818 0.028 208.3);
}Tailwind CSS v4
@theme {
--color-floating-blue: #b0c9cd;
--color-floating-blue-50: #edf7f9;
--color-floating-blue-100: #deebed;
--color-floating-blue-200: #c8d8db;
--color-floating-blue-300: #a8bcbf;
--color-floating-blue-400: #8ca3a7;
--color-floating-blue-500: #728c90;
--color-floating-blue-600: #60767a;
--color-floating-blue-700: #4d5f61;
--color-floating-blue-800: #384547;
--color-floating-blue-900: #263031;
--color-floating-blue-950: #141c1d;
}SCSS
$floating-blue: #b0c9cd;
$floating-blue-rgb: 176, 201, 205;
$floating-blue-light: mix(#fff, $floating-blue, 20%);
$floating-blue-dark: mix(#000, $floating-blue, 20%);
.element {
color: $floating-blue;
box-shadow: 0 0 0 2px rgba($floating-blue, 0.35);
}