Black Gradients
Explore thousands of gradient combinations or generate a custom gradient with the Gradient Generator.
Black gradients are defined by lightness, not hue, with L values from 5 to 20 across any angle. They read as black to charcoal, ink to navy, black to plum, or tinted near black.
Murky Jet
Midnight Obsidian
Obsidian Steel
Eclipse Jet
Charcoal Void
Dusk Flint
Midnight Shadow
Midnight Jet
Obsidian Raven
Shadow Steel
Shadow Void
Twilight Basalt
Dusky Iron
Dense Void
Charcoal Granite
Midnight Flint
Moody Coal
Charcoal Obsidian
Twilight Obsidian
Night Steel
Shadow Raven
Moody Basalt
Profound Shadow
Shadow Basalt
Profound Graphite
Deep Void
Somber Steel
Dense Obsidian
Murky Shadow
Moody Shadow
Storm Basalt
Obsidian Void
Abyssal Granite
Moody Granite
Night Iron
Moody Obsidian
Midnight Coal
Moody Iron
Abyssal Shadow
Night Shadow
Murky Carbon
Dusky Granite
Intense Iron
Night Raven
Eclipse Raven
Somber Granite
Somber Slate
Twilight Flint
Abyssal Obsidian
Midnight Granite
Abyssal Iron
Intense Raven
Profound Void
Murky Flint
Dusky Void
Dusk Coal
Dense Granite
Profound Raven
Obsidian Onyx
Murky Steel
Where Black Gradients Work
Black gradients suit dark mode sections, album art, premium product pages, launch teasers, and dramatic poster backgrounds. They are friendly to white text, but pure white on near black can feel harsh in long copy. Use #f3f4f6 or #e5e7eb for body text, and make sure tinted dark stops do not hide low contrast icons. Need a different angle or an extra stop? Adjust any of these in the Gradient Generator.
Frequently Asked Questions
Why do black gradients look blue or purple?
They can use any hue as long as lightness stays from 5 to 20. The tint appears only in the transition.
What text color works on black gradients?
Soft white or light gray works best. Use pure white for short labels or priority headings, not long paragraphs.