لون مسمّى · #A7BAD3
Babbling Creek
Babbling Creek هو #A7BAD3: rgb(167 186 211)، hsl(214 33% 74%)، oklch(0.783 0.041 255.3). شاهد الدرجات الفاتحة والداكنة والتناسقات وتباين WCAG وAPCA وأكواد CSS وTailwind v4 وSCSS.
What does Blue mean? → · Babbling Creek color name →
#A7BAD3
oklch(0.783 0.041 255.3)
تحويلات الألوان
- HEX
- #a7bad3
- RGB
- rgb(167 186 211)
- HSL
- hsl(214 33% 74%)
- HWB
- hwb(214 65% 17%)
- OKLCH
- oklch(0.783 0.041 255.3)
- OKLab
- oklab(0.783 -0.01 -0.04)
- CIE Lab
- lab(74.67 -2.73 -14.96)
- LCH
- lch(74.67 15.2 259.6)
- CMYK
- cmyk(21% 12% 0% 17%)
درجات فاتحة · درجات داكنة · درجات رمادية
درجات فاتحة
- B0C1D7
- B8C8DC
- C1CEE0
- CAD5E5
- D2DCE9
- DBE3ED
- E4EAF2
- EDF1F6
- F6F8FB
درجات داكنة
- 91A1B7
- 7B899C
- 667282
- 525C69
- 3E4651
- 2C323A
- 1A1E24
- 0A0D10
- 010202
درجات رمادية
- A3B4CA
- 9FAEC2
- 9BA8B9
- 97A2B1
- 939DA9
- 9097A0
- 8C9198
- 888B90
- 848688
تناسق الألوان
متمم +180°
- A7BAD3
Babbling Creek
- C8B59B
≈ Sourdough
متجاور -30° +30°
- A7BAD3
Babbling Creek
- 9DBECD
≈ Gift of the Sea
- B5B5D2
≈ Hundred Waters
ثلاثي +120° +240°
- A7BAD3
Babbling Creek
- D2AEAF
≈ Ballet Rose
- ADBFA4
≈ Meadow Morn
متمم منقسم +150° +210°
- A7BAD3
Babbling Creek
- D0B1A3
≈ Rose Dust
- BCBA9C
≈ Dried Thyme
رباعي +90° +180° +270°
- A7BAD3
Babbling Creek
- CDAEBE
≈ Pink Potion
- C8B59B
≈ Sourdough
- A0C1B2
≈ Green Silk
التباين وإمكانية الوصول
Ag
Failعلى الأبيض
WCAG 1.97:1 · APCA Lc 38
Ag
AAAعلى الأسود
WCAG 10.60:1 · APCA Lc 64
أفضل لون للنص: #000000
WCAG 10.60:1 (AAA) · APCA Lc 64
Contrast pairs
مقتطفات الأكواد
CSS
:root {
--babbling-creek: #a7bad3;
--babbling-creek-rgb: 167 186 211;
--babbling-creek-oklch: oklch(0.783 0.041 255.3);
}
.element {
color: var(--babbling-creek);
background-color: hsl(214 33% 74%);
border-color: oklch(0.783 0.041 255.3);
}Tailwind CSS v4
@theme {
--color-babbling-creek: #a7bad3;
--color-babbling-creek-50: #eef6ff;
--color-babbling-creek-100: #dfe9f6;
--color-babbling-creek-200: #c9d5e6;
--color-babbling-creek-300: #aab9cd;
--color-babbling-creek-400: #8ea0b7;
--color-babbling-creek-500: #7488a2;
--color-babbling-creek-600: #627389;
--color-babbling-creek-700: #4f5c6e;
--color-babbling-creek-800: #384351;
--color-babbling-creek-900: #272f38;
--color-babbling-creek-950: #151b23;
}SCSS
$babbling-creek: #a7bad3;
$babbling-creek-rgb: 167, 186, 211;
$babbling-creek-light: mix(#fff, $babbling-creek, 20%);
$babbling-creek-dark: mix(#000, $babbling-creek, 20%);
.element {
color: $babbling-creek;
box-shadow: 0 0 0 2px rgba($babbling-creek, 0.35);
}