Adlandırılmış renk · #B7DADD
Light Watermark
Light Watermark, #B7DADD: rgb(183 218 221), hsl(185 36% 79%), oklch(0.864 0.037 202.9). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Cyan mean? → · Light Watermark color name →
#B7DADD
oklch(0.864 0.037 202.9)
Renk dönüşümleri
- HEX
- #b7dadd
- RGB
- rgb(183 218 221)
- HSL
- hsl(185 36% 79%)
- HWB
- hwb(185 72% 13%)
- OKLCH
- oklch(0.864 0.037 202.9)
- OKLab
- oklab(0.864 -0.034 -0.014)
- CIE Lab
- lab(84.58 -11.46 -5.54)
- LCH
- lch(84.58 12.73 205.8)
- CMYK
- cmyk(17% 1% 0% 13%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- BEDEE0
- C5E1E4
- CDE5E7
- D4E9EB
- DBECEE
- E2F0F1
- E9F4F5
- F1F8F8
- F8FBFC
Koyu tonlar
- 9FBDC0
- 87A2A4
- 708788
- 5A6C6E
- 455455
- 313C3D
- 1E2526
- 0C1111
- 020202
Gri tonlar
- B1D1D3
- ACC7CA
- A7BEC0
- A1B5B7
- 9CACAD
- 96A3A4
- 919A9B
- 8B9192
- 868989
Renk uyumları
Tamamlayıcı +180°
- B7DADD
Light Watermark
- EAC9C7
≈ Fairy Floss
Analog -30° +30°
- B7DADD
Light Watermark
- BBDBD0
≈ Serene Breeze
- BBD7E7
≈ Light Tidal Foam
Üçlü +120° +240°
- B7DADD
Light Watermark
- DFCBE1
≈ Pouf of Pink
- DED1B7
≈ Spanish White
Bölünmüş tamamlayıcı +150° +210°
- B7DADD
Light Watermark
- E7C9D4
≈ Cradle Pink
- E7CCBC
≈ Peach Brick
Dörtlü +90° +180° +270°
- B7DADD
Light Watermark
- D3CEE9
≈ Vision
- EAC9C7
≈ Fairy Floss
- D2D5BA
≈ Pale Cucumber
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.49:1 · APCA Lc 23
Ag
AAASiyah üzerinde
WCAG 14.08:1 · APCA Lc 80
En iyi metin rengi: #000000
WCAG 14.08:1 (AAA) · APCA Lc 80
Contrast pairs
Kod parçacıkları
CSS
:root {
--light-watermark: #b7dadd;
--light-watermark-rgb: 183 218 221;
--light-watermark-oklch: oklch(0.864 0.037 202.9);
}
.element {
color: var(--light-watermark);
background-color: hsl(185 36% 79%);
border-color: oklch(0.864 0.037 202.9);
}Tailwind CSS v4
@theme {
--color-light-watermark: #b7dadd;
--color-light-watermark-50: #eaf8fa;
--color-light-watermark-100: #daecee;
--color-light-watermark-200: #c3d9dc;
--color-light-watermark-300: #a2bdc0;
--color-light-watermark-400: #85a5a8;
--color-light-watermark-500: #698e91;
--color-light-watermark-600: #59787b;
--color-light-watermark-700: #476062;
--color-light-watermark-800: #334648;
--color-light-watermark-900: #233132;
--color-light-watermark-950: #121d1e;
}SCSS
$light-watermark: #b7dadd;
$light-watermark-rgb: 183, 218, 221;
$light-watermark-light: mix(#fff, $light-watermark, 20%);
$light-watermark-dark: mix(#000, $light-watermark, 20%);
.element {
color: $light-watermark;
box-shadow: 0 0 0 2px rgba($light-watermark, 0.35);
}