Màu có tên · #BFC3BF
Silver Tipped Sage
Silver Tipped Sage là #BFC3BF: rgb(191 195 191), hsl(120 3% 76%), oklch(0.813 0.007 145.5). Xem sắc nhạt, sắc đậm, hòa sắc, tương phản WCAG và APCA, cùng mã CSS, Tailwind v4 và SCSS.
What does Gray mean? → · Silver Tipped Sage color name →
#BFC3BF
oklch(0.813 0.007 145.5)
Chuyển đổi màu
- HEX
- #bfc3bf
- RGB
- rgb(191 195 191)
- HSL
- hsl(120 3% 76%)
- HWB
- hwb(120 75% 24%)
- OKLCH
- oklch(0.813 0.007 145.5)
- OKLab
- oklab(0.813 -0.006 0.004)
- CIE Lab
- lab(78.39 -1.99 1.51)
- LCH
- lch(78.39 2.49 142.8)
- CMYK
- cmyk(2% 0% 2% 24%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- C5C9C5
- CCCFCC
- D2D5D2
- D8DBD8
- DFE1DF
- E5E7E5
- EBEDEB
- F2F3F2
- F8F9F8
Sắc đậm
- A6A9A6
- 8D908D
- 757875
- 5E605E
- 484A48
- 333433
- 1F201F
- 0D0E0D
- 020202
Sắc xám
- B8BCB8
- B2B5B2
- ACAEAC
- A5A8A5
- 9FA19F
- 999A99
- 929492
- 8C8D8C
- 868686
Hòa sắc
Bổ túc +180°
- BFC3BF
Silver Tipped Sage
- C4C0C4
≈ Such Melodrama
Tương đồng -30° +30°
- BFC3BF
Silver Tipped Sage
- C1C2BD
≈ Gull Feather
- BDC3C1
≈ Polished Rock
Bộ ba +120° +240°
- BFC3BF
Silver Tipped Sage
- BFC2C6
≈ Mote of Dust
- C6C0BF
≈ Modest Silver
Bổ túc chia +150° +210°
- BFC3BF
Silver Tipped Sage
- C2C1C6
≈ Mote of Dust
- C6C0C2
≈ Easter Rabbit
Bộ bốn +90° +180° +270°
- BFC3BF
Silver Tipped Sage
- BEC3C6
≈ Metallic
- C4C0C4
≈ Such Melodrama
- C6C1BD
≈ Gallery Grey
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 1.78:1 · APCA Lc 33
Ag
AAATrên nền đen
WCAG 11.77:1 · APCA Lc 70
Màu chữ tốt nhất: #000000
WCAG 11.77:1 (AAA) · APCA Lc 70
Contrast pairs
Đoạn mã
CSS
:root {
--silver-tipped-sage: #bfc3bf;
--silver-tipped-sage-rgb: 191 195 191;
--silver-tipped-sage-oklch: oklch(0.813 0.007 145.5);
}
.element {
color: var(--silver-tipped-sage);
background-color: hsl(120 3% 76%);
border-color: oklch(0.813 0.007 145.5);
}Tailwind CSS v4
@theme {
--color-silver-tipped-sage: #bfc3bf;
--color-silver-tipped-sage-50: #f4f6f4;
--color-silver-tipped-sage-100: #e6e8e6;
--color-silver-tipped-sage-200: #d2d5d2;
--color-silver-tipped-sage-300: #b5b8b5;
--color-silver-tipped-sage-400: #9c9f9c;
--color-silver-tipped-sage-500: #838783;
--color-silver-tipped-sage-600: #6f736f;
--color-silver-tipped-sage-700: #595c59;
--color-silver-tipped-sage-800: #414341;
--color-silver-tipped-sage-900: #2d2e2d;
--color-silver-tipped-sage-950: #1a1b1a;
}SCSS
$silver-tipped-sage: #bfc3bf;
$silver-tipped-sage-rgb: 191, 195, 191;
$silver-tipped-sage-light: mix(#fff, $silver-tipped-sage, 20%);
$silver-tipped-sage-dark: mix(#000, $silver-tipped-sage, 20%);
.element {
color: $silver-tipped-sage;
box-shadow: 0 0 0 2px rgba($silver-tipped-sage, 0.35);
}