This is a free, browser-based generator for black and dark backgrounds. The controls on the left adjust hue, saturation and lightness on the dark end of the spectrum, then layer a pattern (stars, dots, grid, noise, carbon fibre, bokeh or stripes) and two finishing effects (vignette and grain). The matrix on the right shows eight live variations at once. Click a tile to enlarge it, copy its CSS, or export a PNG up to 4K.
Backgrounds are generated entirely in your browser using HTML5 canvas. Nothing is uploaded; the image you download was rendered on your device. The same is true of the CSS code — it is built locally from your current control values.
If you are looking for a starting point, try the 🎲 Randomize button, or browse the topic pages. Foundations: choosing a pattern, picking an export resolution, pure vs near-black, using black backgrounds in web design. Going deeper: CSS gradients, grain and banding, vignette, wallpapers and video and streams.
Last reviewed on 28 April 2026.