Benannte Farbe · #B0D2E7
Chapel Blue
Chapel Blue ist #B0D2E7: rgb(176 210 231), hsl(203 53% 80%), oklch(0.846 0.047 235.2). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Chapel Blue color name →
#B0D2E7
oklch(0.846 0.047 235.2)
Farbumrechnungen
- HEX
- #b0d2e7
- RGB
- rgb(176 210 231)
- HSL
- hsl(203 53% 80%)
- HWB
- hwb(203 69% 9%)
- OKLCH
- oklch(0.846 0.047 235.2)
- OKLab
- oklab(0.846 -0.027 -0.038)
- CIE Lab
- lab(82.22 -8.24 -14.34)
- LCH
- lch(82.22 16.54 240.1)
- CMYK
- cmyk(24% 9% 0% 9%)
Tints · Shades · Tones
Tints
- B8D6E9
- C0DBEC
- C8DFEE
- D0E4F1
- D7E8F3
- DFEDF6
- E7F1F8
- EFF6FA
- F7FAFD
Shades
- 99B6C9
- 829BAB
- 6C818F
- 566873
- 425059
- 2E3940
- 1C2428
- 0B1013
- 010203
Tones
- ABCADC
- A6C1D2
- A2B9C7
- 9DB0BD
- 98A8B2
- 93A0A8
- 8F989E
- 8A9094
- 85888A
Farbharmonien
Komplementär +180°
- B0D2E7
Chapel Blue
- E5C5B0
≈ Pastel Rose Tan
Analog -30° +30°
- B0D2E7
Chapel Blue
- AAD6DB
≈ Light Jellyfish Blue
- BECDEC
≈ Frost Fairy
Triadisch +120° +240°
- B0D2E7
Chapel Blue
- E7C0CE
≈ Childlike
- CBD1AE
≈ Meadow Glen
Geteilt komplementär +150° +210°
- B0D2E7
Chapel Blue
- EAC1BD
≈ Crystal Pink
- DACBAA
≈ Baked Bread
Tetradisch +90° +180° +270°
- B0D2E7
Chapel Blue
- DDC3DD
≈ Simply Lavender
- E5C5B0
≈ Pastel Rose Tan
- BAD5BA
≈ Surf
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.58:1 · APCA Lc 27
Ag
AAAAuf Schwarz
WCAG 13.21:1 · APCA Lc 76
Beste Textfarbe: #000000
WCAG 13.21:1 (AAA) · APCA Lc 76
Contrast pairs
Code-Snippets
CSS
:root {
--chapel-blue: #b0d2e7;
--chapel-blue-rgb: 176 210 231;
--chapel-blue-oklch: oklch(0.846 0.047 235.2);
}
.element {
color: var(--chapel-blue);
background-color: hsl(203 53% 80%);
border-color: oklch(0.846 0.047 235.2);
}Tailwind CSS v4
@theme {
--color-chapel-blue: #b0d2e7;
--color-chapel-blue-50: #e9f8ff;
--color-chapel-blue-100: #daebf6;
--color-chapel-blue-200: #c2d8e6;
--color-chapel-blue-300: #a2bccd;
--color-chapel-blue-400: #84a3b6;
--color-chapel-blue-500: #688ca1;
--color-chapel-blue-600: #587688;
--color-chapel-blue-700: #465e6d;
--color-chapel-blue-800: #324550;
--color-chapel-blue-900: #223038;
--color-chapel-blue-950: #111c22;
}SCSS
$chapel-blue: #b0d2e7;
$chapel-blue-rgb: 176, 210, 231;
$chapel-blue-light: mix(#fff, $chapel-blue, 20%);
$chapel-blue-dark: mix(#000, $chapel-blue, 20%);
.element {
color: $chapel-blue;
box-shadow: 0 0 0 2px rgba($chapel-blue, 0.35);
}