Dark Background Maker
Make a dark background in your browser: a deep two-colour gradient with soft glows of light, a fine grain, a vignette and, if you like, a few thin outline shapes such as rings, arcs and lines. Tick OLED black for a true black ground: every pixel that no glow or shape reaches stays pure black (red, green and blue all 0), for phones and screens with OLED displays. Everything is drawn from numbers by our own code, not photos. Pick the ground, glow and shape colours, then set the glows, the gradient angle, the shapes, the grain and the vignette. The same seed always gives the same picture at a given size; press New seed for a new layout. Tick Seamless for a tile that joins edge to edge. Download a PNG at 12 screen sizes from 4K desktop to phone, a full-page print PDF (Letter or A4) or a 300 DPI print PNG. Nothing is uploaded.
100% private — everything runs in your browser. Everything runs in your browser; nothing is uploaded.
The download is drawn at full size from the same seed and settings as the preview, so it has the same layout with finer detail. The same seed always gives the same picture at a given size.
Picture
Colours
Size
Runs in your browser with our own code: nothing is uploaded or saved. You may use what you make here, including commercially, with no credit needed.
How to make a dark background
- Choose a preset, such as charcoal gradient, midnight blue glow, deep purple haze or OLED black with a teal glow.
- Set the number of glows, their size and strength, and the gradient angle.
- Add thin outline shapes, grain and a vignette.
- Pick the two ground colours, the two glow colours and the shape colour; tick OLED black or Seamless; change the seed until you like it.
- Pick a screen size and download the PNG, or download the print PDF or the 300 DPI print PNG.
What you can use it for
- Phone and desktop wallpapers, with a true black option for OLED screens
- Dark slide and title backgrounds
- Stream, video call and channel backgrounds
- Website hero sections in dark mode
- Posters and flyers with light text
- Seamless dark page backgrounds
The 12 presets
| # | Preset | Glows | Outline shapes | OLED black |
|---|---|---|---|---|
| 1 | Charcoal gradient | 2 | None | No |
| 2 | Midnight blue glow | 3 | None | No |
| 3 | Deep purple haze | 4 | None | No |
| 4 | OLED black with a teal glow | 2 | None | Yes |
| 5 | OLED black with fine gold lines | 1 | 14 | Yes |
| 6 | Dark forest green | 3 | None | No |
| 7 | Espresso brown | 2 | None | No |
| 8 | Navy with outline shapes | 2 | 18 | No |
| 9 | Grainy graphite | 2 | None | No |
| 10 | Ember red glow | 3 | None | No |
| 11 | Teal and violet glows | 5 | None | No |
| 12 | Slate blue-grey, seamless | 4 | 10 | No |
Each preset only fills in the fields and tick boxes; change any colour, setting or the seed afterwards.
The controls
| Control | Range |
|---|---|
| Glows | 0 to 12 |
| Glow size | 5 to 100 |
| Glow strength | 0 to 100 |
| Gradient angle | 0 to 360 |
| Outline shapes | 0 to 40 |
| Shape size | 5 to 100 |
| Shape opacity | 0 to 100 |
| Grain | 0 to 100 |
| Vignette | 0 to 100 |
Download sizes
| Size | Pixels |
|---|---|
| 4K desktop | 3840 × 2160 px |
| QHD desktop | 2560 × 1440 px |
| Full HD | 1920 × 1080 px |
| Ultrawide | 3440 × 1440 px |
| Phone | 1080 × 2400 px |
| Large phone | 1290 × 2796 px |
| Tablet portrait | 2048 × 2732 px |
| Square post | 2048 × 2048 px |
| Story | 1080 × 1920 px |
| Header banner | 1500 × 500 px |
| Video call background | 1920 × 1080 px |
| Square tile | 1024 × 1024 px |
| Print, US Letter | PNG 2550 × 3300 px (300 DPI); PDF 1700 × 2200 px (200 DPI) |
| Print, A4 | PNG 2480 × 3508 px (300 DPI); PDF 1654 × 2339 px (200 DPI) |
Which tool to use
| You want | Use |
|---|---|
| A dark picture with glows, grain and an OLED black option | Dark Background Maker (this page) |
| A CSS gradient to paste into a stylesheet | Gradient Generator |
| To check that text is readable on your background | Contrast Checker |
For a gradient as CSS code, try the Gradient Generator; to test text colours on the dark ground, the Contrast Checker.
More free tools
More background and wallpaper tools?
Background makers and image tools that run privately in your browser, with no sign-up and no watermark.
Frequently asked questions
Is this a photo?
No. Every glow, shape and grain speck is drawn by our own code from numbers, so the picture is yours to use.
Will the same seed give the same picture?
Yes. The same seed and settings give the same pixels at the same size. Our tests draw each preset twice and compare a hash of the PNG; a different seed gives a different picture.
What does OLED black do?
It makes the ground pure black (red, green and blue all 0) and keeps the grain off black pixels, so every pixel that no glow or shape reaches stays true black. In the preset OLED black with a teal glow, at Full HD, 21 % of the pixels are pure black; our tests check that every untouched pixel is.
Are my colours really in the picture?
Yes. At full strength each glow reaches its own colour at its middle. Our tests find both glow colours in the picture.
Can it tile without a seam?
Yes. Tick Seamless: the gradient and the vignette are turned off (a fade cannot repeat), and every glow and shape wraps round the edges, so copies placed edge to edge join with no seam. Our tests check the joins by pixels and check that every shape crossing an edge carries on from the opposite edge.
Will light text be easy to read on it?
Usually, since the ground is dark, but bright glows can lower the contrast behind text. Check your text and background colours with a contrast checker.
Is it free?
Yes. There is no sign-up, no watermark and no limit.
Is anything uploaded?
No. Everything is drawn by JavaScript in your browser and nothing is sent anywhere.