Nazwany kolor · #B6B3BF
Coveted Gem
Coveted Gem to #B6B3BF: rgb(182 179 191), hsl(255 9% 73%), oklch(0.773 0.017 297.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Coveted Gem color name →
#B6B3BF
oklch(0.773 0.017 297.4)
Konwersje koloru
- HEX
- #b6b3bf
- RGB
- rgb(182 179 191)
- HSL
- hsl(255 9% 73%)
- HWB
- hwb(255 70% 25%)
- OKLCH
- oklch(0.773 0.017 297.4)
- OKLab
- oklab(0.773 0.008 -0.015)
- CIE Lab
- lab(73.47 2.8 -5.73)
- LCH
- lch(73.47 6.37 296.1)
- CMYK
- cmyk(5% 6% 0% 25%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- BDBAC5
- C4C2CC
- CBC9D2
- D3D1D8
- DAD8DF
- E1E0E5
- E9E8EB
- F0EFF2
- F7F7F8
Odcienie ciemniejsze
- 9E9BA6
- 86848D
- 6F6E75
- 59585E
- 444348
- 302F33
- 1D1D1F
- 0C0C0D
- 020102
Tony
- B0AEB9
- ABA9B2
- A5A3AC
- A09EA5
- 9B999F
- 959499
- 908F92
- 8B8A8C
- 858586
Harmonie kolorów
Komplementarna +180°
- B6B3BF
Coveted Gem
- B4B7AB
≈ Stone Mill
Analogowa -30° +30°
- B6B3BF
Coveted Gem
- B0B5C0
≈ Glistening Grey
- BBB1BB
≈ Heather Hill
Triada +120° +240°
- B6B3BF
Coveted Gem
- BEB3AB
≈ Hipster Hippo
- AAB9B5
≈ Bidwell Blue
Komplementarna rozszczepiona +150° +210°
- B6B3BF
Coveted Gem
- BAB5A9
≈ Play on Grey
- AEB8AF
≈ Cyprus Spring
Tetrada +90° +180° +270°
- B6B3BF
Coveted Gem
- C0B1AF
≈ Mouse Trap
- B4B7AB
≈ Stone Mill
- A9B8BB
≈ Half Sea Fog
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.06:1 · APCA Lc 40
Ag
AAANa czerni
WCAG 10.18:1 · APCA Lc 62
Najlepszy kolor tekstu: #000000
WCAG 10.18:1 (AAA) · APCA Lc 62
Contrast pairs
Fragmenty kodu
CSS
:root {
--coveted-gem: #b6b3bf;
--coveted-gem-rgb: 182 179 191;
--coveted-gem-oklch: oklch(0.773 0.017 297.4);
}
.element {
color: var(--coveted-gem);
background-color: hsl(255 9% 73%);
border-color: oklch(0.773 0.017 297.4);
}Tailwind CSS v4
@theme {
--color-coveted-gem: #b6b3bf;
--color-coveted-gem-50: #f6f4f9;
--color-coveted-gem-100: #e8e7ed;
--color-coveted-gem-200: #d5d3db;
--color-coveted-gem-300: #b8b6bf;
--color-coveted-gem-400: #9f9ca8;
--color-coveted-gem-500: #878490;
--color-coveted-gem-600: #72707a;
--color-coveted-gem-700: #5b5962;
--color-coveted-gem-800: #434148;
--color-coveted-gem-900: #2e2d32;
--color-coveted-gem-950: #1b1a1e;
}SCSS
$coveted-gem: #b6b3bf;
$coveted-gem-rgb: 182, 179, 191;
$coveted-gem-light: mix(#fff, $coveted-gem, 20%);
$coveted-gem-dark: mix(#000, $coveted-gem, 20%);
.element {
color: $coveted-gem;
box-shadow: 0 0 0 2px rgba($coveted-gem, 0.35);
}