# Gradient art: abstract pieces for walls and screens

[Canonical HTML page](https://gradiently.design/guide/gradient-art)

A gradient on its own can be a finished artwork: a field of colour you live with rather than read. Here is how to make pieces that hold up on a wall, on a screen and as a set.

## The short version

- Gradient art is abstract artwork made from blended fields of colour, printed for walls or shown on screens, with no subject other than colour and light.
- A gradient art print needs its pixel size worked out at 300 dpi, such as 2480×3508 for A4, 3508×4961 for A3 or 5400×7200 for an 18×24 inch poster.
- Fine grain helps printed gradients look smooth, because it hides the visible steps that slow blends can show on paper.
- Bright screen colours, especially vivid blues, greens and neons, often print duller, so order a proof before printing a full run.
- Gradient art is strongest as a series: keep the structure and ratio the same, and change one thing, such as hue or time of day, across the set.

**Gradient art** is abstract artwork made from blended fields of colour. There is no subject to recognise, only colour, light and the way one tone becomes another, which is why it sits so easily on a bedroom wall, in a studio or on a screen in a café. Good gradient art feels deliberate: a clear structure, a small family of colours, a surface with some texture, and a size and ratio chosen for where it will hang or play.

This guide covers the main styles, how to choose colours that stay clean, exact print sizes, how to prepare files for print, how to make screen art and loops, and why series work better than single pieces.

## What gradient art is, and the main styles

Gradient art belongs to a long tradition of paintings about colour itself. Colour-field painters built canvases from large areas of flat or softly shifting colour, and Josef Albers painted his *Homage to the Square* as a long series of nested squares that show how neighbouring colours change each other. Digital gradients let you make the same kind of work with exact control and repeatable results.

Most gradient artworks use one of a few structures. Choose the structure first, because it decides how the piece feels before colour does. For the technical side of each, see [types of gradients](https://gradiently.design/guide/types-of-gradients).

- Horizon: ember under indigo: `linear-gradient(180deg, #0d1030 0%, #3b2466 45%, #ff7a45 70%, #ffd6a0 100%)`
- Glow: amber orb on black: `radial-gradient(circle at 50% 55%, #ffc46b 0%, #ff7a1a 18%, #5a1a08 45%, #0a0706 75%)`
- Sweep: teal and violet: `conic-gradient(from 200deg at 50% 50%, #0f766e, #22d3ee, #7c3aed, #0f766e)`
- Stepped: five bands of blue: `linear-gradient(180deg, #0a1f44 0% 20%, #173a73 20% 40%, #2d5ea8 40% 60%, #5b8fd6 60% 80%, #a9c8f0 80% 100%)`
- Soft field: sage into sand: `linear-gradient(135deg, #8fa98b 0%, #c9c7a4 50%, #e9dcc3 100%)`
- Bloom: rose in plum: `radial-gradient(ellipse at 30% 70%, #ff8fb1 0%, #c2417a 35%, #3d0f35 80%)`

Six structures: horizon, glow, sweep, stepped bands, soft field and off-centre bloom. Each is a starting point for a whole piece.

## Choosing colours for a gradient artwork

Art you live with needs colour that stays pleasant for months, not seconds. The safest approach is one hue family running from dark to light, with a single accent where the eye should rest. [Analogous colours](https://gradiently.design/guide/analogous-colors) blend cleanly; complementary pairs such as blue and orange need a midpoint stop, or the middle turns grey. [Muddy gradients](https://gradiently.design/guide/muddy-gradients) explains why and how to fix it.

- Deep wine: #2a0a12
- Crimson: #7a1630
- Coral red: #d64545
- Apricot: #f59e6b
- Cream light: #fde2c4

One warm family from almost black to cream. Every step is a neighbour of the last, so the blend never passes through grey.

Think about the room as well as the file. Dark, saturated pieces glow on screens and feel intimate on a wall; pale, low-contrast pieces feel calm and recede. Warm families bring a space closer, cool ones open it up. [Warm and cool colours](https://gradiently.design/guide/warm-and-cool-colors) covers the effect.

## Print sizes for gradient art at 300 dpi

Print at 300 dots per inch for pieces seen up close. Work out the pixel size before you start, so the file is made at full resolution rather than enlarged later. These are the common sizes.

| Print | Pixels at 300 dpi | Ratio |
| --- | --- | --- |
| Postcard | 1800×1200 | 3:2 |
| 5×7 in | 1500×2100 | 5:7 |
| A5 | 1748×2480 | 1:1.414 |
| A4 | 2480×3508 | 1:1.414 |
| US Letter | 2550×3300 | 17:22 |
| A3 | 3508×4961 | 1:1.414 |
| 18×24 in poster | 5400×7200 | 3:4 |

Pixel sizes for common print formats at 300 dpi.

- A5: 1748 × 2480
- A4: 2480 × 3508
- A3: 3508 × 4961
- 18×24 in: 5400 × 7200
- 5×7 in: 1500 × 2100
- Postcard: 1800 × 1200

The same sizes drawn to scale. A5, A4 and A3 share one shape; the others each need their own composition.

A-series paper keeps the same proportions at every size, so one composition scales from A5 to A3 without cropping. That makes A sizes the easiest choice if you want to sell or give one piece in several sizes. An 18×24 inch poster is 3:4, noticeably wider, so re-compose it rather than stretching an A-size file. For large prints, design at a third of the size and export at three times: an 1800×2400 design exported at 3× is exactly 5400×7200.

## How to prepare gradient art for print

1. **Build at full size** Start the file at its final pixel size from the table, or at an exact fraction you will export at a whole multiple.
2. **Add fine grain** Slow, smooth blends can print with visible steps. A light, even grain breaks those steps up. See [gradient banding](https://gradiently.design/guide/gradient-banding) and [grainy gradients](https://gradiently.design/guide/grainy-gradients).
3. **Check the colours that may not print** Vivid blues, greens, violets and neons on screen often print duller on paper. Pull those colours back slightly, or accept the shift and judge the proof.
4. **Allow for bleed** If the colour runs to the edge, extend it past the trim by the amount your printer asks for, often 3 mm, which is about 35 px at 300 dpi.
5. **Order one proof** Print a single copy on the paper you intend to use and look at it in daylight and lamplight before ordering a run.

Paper changes the piece. Matte papers soften colour and suit calm, pale work; satin and gloss keep dark, saturated gradients deep. [Print gradients](https://gradiently.design/guide/print-gradients) goes further into colour modes and file formats.

## Gradient art for screens and walls that move

Screens show gradient art at its most luminous, because they emit light rather than reflect it. Design for the screen's shape: 1920×1080 for a landscape display, 1080×1920 for a vertical one. Motion is the other advantage. A slow drift of light across a gradient turns a still piece into something closer to a window.

An A3 portrait art print of a deep, glowing gradient with the small title Dusk, No. 3

For a wall: an A3 print, one quiet title and a lot of colour.

A landscape screen artwork using the same gradient as the print beside it, with the small title Slow light

For a screen: the same material in landscape, made to move.

```css
.art {
  width: 100vw;
  height: 100vh;
  background:
    radial-gradient(ellipse at 30% 70%, #ff8fb1 0%, transparent 55%),
    radial-gradient(ellipse at 75% 25%, #7c3aed 0%, transparent 60%),
    linear-gradient(160deg, #1a0b2e 0%, #3d0f35 100%);
  background-size: 140% 140%;
  animation: drift 40s ease-in-out infinite alternate;
}

@keyframes drift {
  from { background-position: 0% 0%; }
  to { background-position: 100% 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .art { animation: none; }
}
```

A full-screen piece in plain CSS: two soft lights over a plum ground, drifting over 40 seconds and holding still for people who prefer reduced motion.

For a TV, frame display or projector, export a video instead. Gradiently exports 5 to 30 second seamless loops with chosen movement and pace, which can repeat for hours without a visible jump. [Seamless loop video](https://gradiently.design/guide/seamless-loop-video) and [live wallpaper](https://gradiently.design/guide/live-wallpaper) cover formats and settings.

## Making gradient art as a series

A single gradient on a wall can look like a sample. Three that clearly belong together look like a body of work. The rule of a series is simple: keep the structure, the ratio and the texture the same, and change one variable across the set, such as hue, time of day, angle or the position of the light.

- Dawn: `linear-gradient(180deg, #1e2a5a 0%, #8a6fb3 45%, #f7b7a3 80%, #ffe3c2 100%)`
- Noon: `linear-gradient(180deg, #1c6fd1 0%, #5aa9ef 50%, #cfe8fb 100%)`
- Dusk: `linear-gradient(180deg, #0c0a24 0%, #4b1d5e 40%, #c2415a 75%, #f28c4b 100%)`

A triptych: the same vertical structure, one variable, the time of day. Hung side by side at A3, they read as one piece.

Name and number the pieces, like *Dusk, No. 3*, and keep a record of every colour and setting so you can make the next one to match. A Mark is useful here: its recipe of colours, materials, light and grain stays fixed, so every print and loop in a series renders from exactly the same source.

A Mark as the source of a series: one recipe, rendered at any print size or as a loop.

> **Live with it first** Before printing, set the artwork as your laptop or phone background for a week. If you still like it on day seven, it is ready for a wall.

## FAQ

### What is gradient art?

Gradient art is abstract artwork made from blended fields of colour, printed for walls or shown on screens. Its subject is colour and light rather than any recognisable object.

### What resolution should a gradient art print be?

Use 300 dpi for prints seen up close. That is 2480×3508 pixels for A4, 3508×4961 for A3 and 5400×7200 for an 18×24 inch poster.

### Why does my gradient print with stripes?

Slow, smooth blends can show visible steps, called banding, when printed. Adding a light, even grain to the file usually breaks the steps up and makes the blend look smooth on paper.

### Why do my gradient colours look duller when printed?

Screens emit light and can show more vivid blues, greens and neons than ink on paper can reproduce. Order a proof and adjust the brightest colours if the shift matters.

### How do I make a gradient art series?

Keep the structure, ratio and texture identical across the set and change one variable, such as hue, time of day or the position of the light. Name and number each piece so the set reads as one body of work.