لون مسمّى · #BAD3C7
Sage Bundle
Sage Bundle هو #BAD3C7: rgb(186 211 199)، hsl(151 22% 78%)، oklch(0.845 0.031 165.2). شاهد الدرجات الفاتحة والداكنة والتناسقات وتباين WCAG وAPCA وأكواد CSS وTailwind v4 وSCSS.
What does Gray mean? → · Sage Bundle color name →
#BAD3C7
oklch(0.845 0.031 165.2)
تحويلات الألوان
- HEX
- #bad3c7
- RGB
- rgb(186 211 199)
- HSL
- hsl(151 22% 78%)
- HWB
- hwb(151 73% 17%)
- OKLCH
- oklch(0.845 0.031 165.2)
- OKLab
- oklab(0.845 -0.03 0.008)
- CIE Lab
- lab(82.42 -10.41 2.98)
- LCH
- lch(82.42 10.83 164)
- CMYK
- cmyk(12% 0% 6% 17%)
درجات فاتحة · درجات داكنة · درجات رمادية
درجات فاتحة
- C1D7CC
- C8DCD2
- CFE0D8
- D5E4DD
- DCE9E3
- E3EDE8
- EAF2EE
- F1F6F4
- F8FBF9
درجات داكنة
- A1B7AD
- 899C93
- 72827A
- 5C6962
- 46514C
- 323A36
- 1E2421
- 0D100E
- 020202
درجات رمادية
- B4CAC0
- AEC2B8
- A8B9B1
- A3B1AA
- 9DA9A3
- 97A09C
- 919895
- 8B908E
- 868887
تناسق الألوان
متمم +180°
- BAD3C7
Sage Bundle
- DCC4D1
≈ Scented Soap
متجاور -30° +30°
- BAD3C7
Sage Bundle
- C3D1BD
≈ Budding Green
- B5D3D2
≈ Lakeside Find
ثلاثي +120° +240°
- BAD3C7
Sage Bundle
- C9CAE0
≈ Periwinkle Powder
- DFC6BB
≈ Pale Sienna
متمم منقسم +150° +210°
- BAD3C7
Sage Bundle
- D4C6DB
≈ Prudence
- E0C4C5
≈ Odyssey Plum
رباعي +90° +180° +270°
- BAD3C7
Sage Bundle
- BFCEE1
≈ Sky’s the Limit
- DCC4D1
≈ Scented Soap
- D8CAB6
≈ Brown Mouse
التباين وإمكانية الوصول
Ag
Failعلى الأبيض
WCAG 1.58:1 · APCA Lc 27
Ag
AAAعلى الأسود
WCAG 13.23:1 · APCA Lc 76
أفضل لون للنص: #000000
WCAG 13.23:1 (AAA) · APCA Lc 76
Contrast pairs
مقتطفات الأكواد
CSS
:root {
--sage-bundle: #bad3c7;
--sage-bundle-rgb: 186 211 199;
--sage-bundle-oklch: oklch(0.845 0.031 165.2);
}
.element {
color: var(--sage-bundle);
background-color: hsl(151 22% 78%);
border-color: oklch(0.845 0.031 165.2);
}Tailwind CSS v4
@theme {
--color-sage-bundle: #bad3c7;
--color-sage-bundle-50: #edf8f3;
--color-sage-bundle-100: #dfebe6;
--color-sage-bundle-200: #c8d9d1;
--color-sage-bundle-300: #a9bdb4;
--color-sage-bundle-400: #8ea59a;
--color-sage-bundle-500: #738d81;
--color-sage-bundle-600: #62776d;
--color-sage-bundle-700: #4e6057;
--color-sage-bundle-800: #39463f;
--color-sage-bundle-900: #27302c;
--color-sage-bundle-950: #151d19;
}SCSS
$sage-bundle: #bad3c7;
$sage-bundle-rgb: 186, 211, 199;
$sage-bundle-light: mix(#fff, $sage-bundle, 20%);
$sage-bundle-dark: mix(#000, $sage-bundle, 20%);
.element {
color: $sage-bundle;
box-shadow: 0 0 0 2px rgba($sage-bundle, 0.35);
}