Colore con nome · #B1A3A1
Flexible Grey
Flexible Grey è #B1A3A1: rgb(177 163 161), hsl(7 9% 66%), oklch(0.727 0.017 27.3). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Flexible Grey color name →
#B1A3A1
oklch(0.727 0.017 27.3)
Conversioni di colore
- HEX
- #b1a3a1
- RGB
- rgb(177 163 161)
- HSL
- hsl(7 9% 66%)
- HWB
- hwb(7 63% 31%)
- OKLCH
- oklch(0.727 0.017 27.3)
- OKLab
- oklab(0.727 0.015 0.008)
- CIE Lab
- lab(68.17 5 2.98)
- LCH
- lch(68.17 5.81 30.8)
- CMYK
- cmyk(0% 8% 9% 31%)
Tinte · Ombre · Toni
Tinte
- B9ACAA
- C0B5B3
- C8BEBC
- D0C7C6
- D7D0CF
- DFD9D8
- E7E3E2
- EFECEC
- F7F5F5
Ombre
- 998D8B
- 837876
- 6C6362
- 574F4E
- 423C3C
- 2F2A2A
- 1C1919
- 0C0A09
- 010101
Toni
- AC9F9E
- A79C9A
- A29897
- 9D9594
- 989190
- 938E8D
- 8E8A8A
- 8A8786
- 858383
Armonie di colore
Complementare +180°
- B1A3A1
Flexible Grey
- 9BAAAC
≈ Mission Bay Blue
Analogo -30° +30°
- B1A3A1
Flexible Grey
- B0A3A7
≈ Quest Grey
- AFA49D
≈ Hibernate
Triadico +120° +240°
- B1A3A1
Flexible Grey
- A0AAA1
≈ Halcyon Green
- A2A7B2
≈ Great Falls
Complementare divisa +150° +210°
- B1A3A1
Flexible Grey
- 9CAAA6
≈ Halcyon Green
- 9DA9B0
≈ Seryi Grey
Tetradico +90° +180° +270°
- B1A3A1
Flexible Grey
- A6A89D
≈ Old Celadon
- 9BAAAC
≈ Mission Bay Blue
- A8A5B0
≈ Palace Walls
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 2.43:1 · APCA Lc 48
Ag
AAASu nero
WCAG 8.62:1 · APCA Lc 54
Miglior colore del testo: #000000
WCAG 8.62:1 (AAA) · APCA Lc 54
Contrast pairs
Frammenti di codice
CSS
:root {
--flexible-grey: #b1a3a1;
--flexible-grey-rgb: 177 163 161;
--flexible-grey-oklch: oklch(0.727 0.017 27.3);
}
.element {
color: var(--flexible-grey);
background-color: hsl(7 9% 66%);
border-color: oklch(0.727 0.017 27.3);
}Tailwind CSS v4
@theme {
--color-flexible-grey: #b1a3a1;
--color-flexible-grey-50: #faf3f2;
--color-flexible-grey-100: #ede6e5;
--color-flexible-grey-200: #dbd2d0;
--color-flexible-grey-300: #c0b4b2;
--color-flexible-grey-400: #a89b99;
--color-flexible-grey-500: #918280;
--color-flexible-grey-600: #7b6e6c;
--color-flexible-grey-700: #625857;
--color-flexible-grey-800: #48403f;
--color-flexible-grey-900: #322c2c;
--color-flexible-grey-950: #1e1919;
}SCSS
$flexible-grey: #b1a3a1;
$flexible-grey-rgb: 177, 163, 161;
$flexible-grey-light: mix(#fff, $flexible-grey, 20%);
$flexible-grey-dark: mix(#000, $flexible-grey, 20%);
.element {
color: $flexible-grey;
box-shadow: 0 0 0 2px rgba($flexible-grey, 0.35);
}