Gray Gradients
Explore thousands of gradient combinations or generate a custom gradient with the Gradient Generator.
Gray gradients use saturation from 0 to 15 percent and lightness from 30 to 70. That creates graphite to silver, cool blue gray, and warm greige blends without strong color.
Inky Granite
Dusk Granite
Deep Coal
Somber Jet
Profound Slate
Twilight Raven
Profound Obsidian
Murky Carbon
Deep Slate
Dark Steel
Twilight Flint
Murky Steel
Profound Shadow
Charcoal Flint
Night Flint
Moody Onyx
Eclipse Coal
Abyssal Jet
Intense Coal
Eclipse Graphite
Dusky Carbon
Intense Flint
Abyssal Carbon
Obsidian Shadow
Shadow Raven
Obsidian Raven
Dense Raven
Shadow Slate
Dense Flint
Dark Raven
Dusk Carbon
Deep Onyx
Murky Basalt
Moody Steel
Midnight Jet
Twilight Granite
Charcoal Basalt
Midnight Iron
Midnight Granite
Moody Slate
Storm Jet
Dense Slate
Abyssal Graphite
Dusky Granite
Inky Onyx
Murky Iron
Intense Iron
Dusky Raven
Dusk Slate
Eclipse Void
Dark Coal
Shadow Void
Storm Carbon
Shadow Flint
Dark Basalt
Dusk Coal
Charcoal Void
Profound Void
Night Shadow
Dusky Obsidian
Where Gray Gradients Work
Gray gradients are useful for app chrome, neutral section breaks, B2B reports, mockup backdrops, and print style posters. They make products and typography feel central because the color stays restrained. The main risk is low contrast between gray text and gray stops. Use near black copy on light silver, or white copy only on charcoal regions that pass 4.5:1. Need a different angle or an extra stop? Adjust any of these in the Gradient Generator.
Frequently Asked Questions
Why do my gray gradients look muddy?
Gray looks muddy when saturation rises and the hue shift is unclear. Keep saturation under 15 percent for a true gray family.
What colors pair with gray gradients?
Gray pairs with black, white, blue gray, greige, and one brand accent. Keep the accent outside the gradient for clarity.