Colore con nome · #8B9AB9
Periwinkle Blossom
Periwinkle Blossom è #8B9AB9: rgb(139 154 185), hsl(220 25% 64%), oklch(0.685 0.049 264.8). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Periwinkle Blossom color name →
#8B9AB9
oklch(0.685 0.049 264.8)
Conversioni di colore
- HEX
- #8b9ab9
- RGB
- rgb(139 154 185)
- HSL
- hsl(220 25% 64%)
- HWB
- hwb(220 55% 27%)
- OKLCH
- oklch(0.685 0.049 264.8)
- OKLab
- oklab(0.685 -0.004 -0.049)
- CIE Lab
- lab(63.22 -0.25 -18.06)
- LCH
- lch(63.22 18.06 269.2)
- CMYK
- cmyk(25% 17% 0% 27%)
Tinte · Ombre · Toni
Tinte
- 96A4C0
- A1AEC7
- ADB7CE
- B8C1D5
- C3CCDC
- CFD6E3
- DBE0EA
- E7EAF1
- F3F5F8
Ombre
- 7885A0
- 667189
- 545E71
- 434B5B
- 323946
- 232731
- 14171E
- 07090D
- 010102
Toni
- 8A97B3
- 8995AD
- 8892A8
- 8790A2
- 868D9C
- 848A97
- 838891
- 82858B
- 818386
Armonie di colore
Complementare +180°
- 8B9AB9
Periwinkle Blossom
- A89878
≈ Olive Chutney
Analogo -30° +30°
- 8B9AB9
Periwinkle Blossom
- 7D9FB4
≈ Blue Cascade
- 9B94B6
≈ Indifferent
Triadico +120° +240°
- 8B9AB9
Periwinkle Blossom
- B78F8B
≈ Brandy Snaps
- 88A287
≈ Gallery Green
Complementare divisa +150° +210°
- 8B9AB9
Periwinkle Blossom
- B3927D
≈ Changing Seasons
- 999E7B
≈ Renkon Beige
Tetradico +90° +180° +270°
- 8B9AB9
Periwinkle Blossom
- B38E9B
≈ Mauve Shadows
- A89878
≈ Olive Chutney
- 7AA498
≈ Twining Vine
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 2.82:1 · APCA Lc 54
Ag
AAASu nero
WCAG 7.42:1 · APCA Lc 47
Miglior colore del testo: #000000
WCAG 7.42:1 (AAA) · APCA Lc 47
Contrast pairs
Frammenti di codice
CSS
:root {
--periwinkle-blossom: #8b9ab9;
--periwinkle-blossom-rgb: 139 154 185;
--periwinkle-blossom-oklch: oklch(0.685 0.049 264.8);
}
.element {
color: var(--periwinkle-blossom);
background-color: hsl(220 25% 64%);
border-color: oklch(0.685 0.049 264.8);
}Tailwind CSS v4
@theme {
--color-periwinkle-blossom: #8b9ab9;
--color-periwinkle-blossom-50: #eff5ff;
--color-periwinkle-blossom-100: #e0e8f9;
--color-periwinkle-blossom-200: #cbd4ea;
--color-periwinkle-blossom-300: #acb7d1;
--color-periwinkle-blossom-400: #909fbc;
--color-periwinkle-blossom-500: #7686a7;
--color-periwinkle-blossom-600: #64728d;
--color-periwinkle-blossom-700: #505b71;
--color-periwinkle-blossom-800: #394354;
--color-periwinkle-blossom-900: #272e3a;
--color-periwinkle-blossom-950: #151b24;
}SCSS
$periwinkle-blossom: #8b9ab9;
$periwinkle-blossom-rgb: 139, 154, 185;
$periwinkle-blossom-light: mix(#fff, $periwinkle-blossom, 20%);
$periwinkle-blossom-dark: mix(#000, $periwinkle-blossom, 20%);
.element {
color: $periwinkle-blossom;
box-shadow: 0 0 0 2px rgba($periwinkle-blossom, 0.35);
}