Colore con nome · #7F8CB8
Galactic Gossamer
Galactic Gossamer è #7F8CB8: rgb(127 140 184), hsl(226 29% 61%), oklch(0.646 0.068 271.7). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Galactic Gossamer color name →
#7F8CB8
oklch(0.646 0.068 271.7)
Conversioni di colore
- HEX
- #7f8cb8
- RGB
- rgb(127 140 184)
- HSL
- hsl(226 29% 61%)
- HWB
- hwb(226 50% 28%)
- OKLCH
- oklch(0.646 0.068 271.7)
- OKLab
- oklab(0.646 0.002 -0.068)
- CIE Lab
- lab(58.44 3.03 -24.83)
- LCH
- lch(58.44 25.02 277)
- CMYK
- cmyk(31% 24% 0% 28%)
Tinte · Ombre · Toni
Tinte
- 8B97BF
- 97A2C6
- A4AECE
- B0B9D5
- BDC4DC
- CAD0E3
- D7DCEA
- E4E7F1
- F1F3F8
Ombre
- 6E79A0
- 5D6788
- 4C5571
- 3C435B
- 2D3345
- 1F2331
- 11141E
- 06070C
- 010102
Toni
- 7F8BB2
- 7F8AAD
- 7F89A7
- 7F88A2
- 7F869C
- 808597
- 808491
- 80838B
- 808186
Armonie di colore
Complementare +180°
- 7F8CB8
Galactic Gossamer
- 9D8D5D
≈ Pineapple Sage
Analogo -30° +30°
- 7F8CB8
Galactic Gossamer
- 6994B4
≈ Aragonite Blue
- 9585B1
≈ Silk Lilac
Triadico +120° +240°
- 7F8CB8
Galactic Gossamer
- B47F74
≈ Brick Fence
- 6F9A79
≈ Precious Oxley
Complementare divisa +150° +210°
- 7F8CB8
Galactic Gossamer
- AC8563
≈ Roman Coin
- 879566
≈ Bullfrog
Tetradico +90° +180° +270°
- 7F8CB8
Galactic Gossamer
- B17D8B
≈ Degas Pink
- 9D8D5D
≈ Pineapple Sage
- 5D9C91
≈ Treasure Isle
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 3.30:1 · APCA Lc 60
Ag
AASu nero
WCAG 6.34:1 · APCA Lc 41
Miglior colore del testo: #000000
WCAG 6.34:1 (AA) · APCA Lc 41
Contrast pairs
Frammenti di codice
CSS
:root {
--galactic-gossamer: #7f8cb8;
--galactic-gossamer-rgb: 127 140 184;
--galactic-gossamer-oklch: oklch(0.646 0.068 271.7);
}
.element {
color: var(--galactic-gossamer);
background-color: hsl(226 29% 61%);
border-color: oklch(0.646 0.068 271.7);
}Tailwind CSS v4
@theme {
--color-galactic-gossamer: #7f8cb8;
--color-galactic-gossamer-50: #eff4ff;
--color-galactic-gossamer-100: #e0e7ff;
--color-galactic-gossamer-200: #cbd3f2;
--color-galactic-gossamer-300: #acb6db;
--color-galactic-gossamer-400: #909dc7;
--color-galactic-gossamer-500: #7684b4;
--color-galactic-gossamer-600: #647098;
--color-galactic-gossamer-700: #50597a;
--color-galactic-gossamer-800: #39415a;
--color-galactic-gossamer-900: #272d3f;
--color-galactic-gossamer-950: #151a28;
}SCSS
$galactic-gossamer: #7f8cb8;
$galactic-gossamer-rgb: 127, 140, 184;
$galactic-gossamer-light: mix(#fff, $galactic-gossamer, 20%);
$galactic-gossamer-dark: mix(#000, $galactic-gossamer, 20%);
.element {
color: $galactic-gossamer;
box-shadow: 0 0 0 2px rgba($galactic-gossamer, 0.35);
}