Colore con nome · #B1A4B4
Midsummer Twilight
Midsummer Twilight è #B1A4B4: rgb(177 164 180), hsl(289 10% 67%), oklch(0.735 0.027 319.9). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Midsummer Twilight color name →
#B1A4B4
oklch(0.735 0.027 319.9)
Conversioni di colore
- HEX
- #b1a4b4
- RGB
- rgb(177 164 180)
- HSL
- hsl(289 10% 67%)
- HWB
- hwb(289 64% 29%)
- OKLCH
- oklch(0.735 0.027 319.9)
- OKLab
- oklab(0.735 0.021 -0.017)
- CIE Lab
- lab(68.87 7.08 -6.49)
- LCH
- lch(68.87 9.61 317.5)
- CMYK
- cmyk(2% 9% 0% 29%)
Tinte · Ombre · Toni
Tinte
- B9ADBB
- C0B6C3
- C8BFCA
- D0C8D1
- D7D1D9
- DFDAE0
- E7E3E8
- EFECF0
- F7F6F7
Ombre
- 998E9C
- 837985
- 6C646E
- 575058
- 423D44
- 2F2B30
- 1C1A1D
- 0C0A0C
- 010102
Toni
- ACA0AF
- A79DA9
- A299A4
- 9D959F
- 98929A
- 938E94
- 8E8B8F
- 8A878A
- 858485
Armonie di colore
Complementare +180°
- B1A4B4
Midsummer Twilight
- A1AE9E
≈ Wormwood Green
Analogo -30° +30°
- B1A4B4
Midsummer Twilight
- A8A7BA
≈ Curated Lilac
- B7A3AB
≈ Magical Mauve
Triadico +120° +240°
- B1A4B4
Midsummer Twilight
- B2A897
≈ Raffia Greige
- 96AFB0
≈ Sliding
Complementare divisa +150° +210°
- B1A4B4
Midsummer Twilight
- AAAB98
≈ Amazon Vine
- 99AFA6
≈ Lovage Green
Tetradico +90° +180° +270°
- B1A4B4
Midsummer Twilight
- B8A59A
≈ Pick of the Litter
- A1AE9E
≈ Wormwood Green
- 99ADB7
≈ Pacific Bliss
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 2.37:1 · APCA Lc 47
Ag
AAASu nero
WCAG 8.83:1 · APCA Lc 55
Miglior colore del testo: #000000
WCAG 8.83:1 (AAA) · APCA Lc 55
Contrast pairs
Frammenti di codice
CSS
:root {
--midsummer-twilight: #b1a4b4;
--midsummer-twilight-rgb: 177 164 180;
--midsummer-twilight-oklch: oklch(0.735 0.027 319.9);
}
.element {
color: var(--midsummer-twilight);
background-color: hsl(289 10% 67%);
border-color: oklch(0.735 0.027 319.9);
}Tailwind CSS v4
@theme {
--color-midsummer-twilight: #b1a4b4;
--color-midsummer-twilight-50: #f9f3fa;
--color-midsummer-twilight-100: #ece5ed;
--color-midsummer-twilight-200: #dad1db;
--color-midsummer-twilight-300: #beb3c0;
--color-midsummer-twilight-400: #a69aa9;
--color-midsummer-twilight-500: #8e8192;
--color-midsummer-twilight-600: #786d7b;
--color-midsummer-twilight-700: #605763;
--color-midsummer-twilight-800: #464049;
--color-midsummer-twilight-900: #312c32;
--color-midsummer-twilight-950: #1d191e;
}SCSS
$midsummer-twilight: #b1a4b4;
$midsummer-twilight-rgb: 177, 164, 180;
$midsummer-twilight-light: mix(#fff, $midsummer-twilight, 20%);
$midsummer-twilight-dark: mix(#000, $midsummer-twilight, 20%);
.element {
color: $midsummer-twilight;
box-shadow: 0 0 0 2px rgba($midsummer-twilight, 0.35);
}