# Colour field painting and the modern gradient

[Canonical HTML page](https://gradiently.design/guide/color-field-painting)

Long before CSS, a group of painters proved that a few colours, softly meeting at a huge scale, could move people. Here is what they did, and what it teaches anyone making gradients now.

## The short version

- Color field painting is a style of abstract painting that developed in the United States from the late 1940s, built on large areas of nearly flat colour.
- Mark Rothko, Barnett Newman and Clyfford Still are its best known early painters, followed by Helen Frankenthaler, Morris Louis and Kenneth Noland.
- Rothko's mature paintings stack soft edged rectangles of colour on a coloured ground, built up in thin layers.
- The ideas behind colour field painting (few colours, soft transitions, large scale and luminous layering) are the same ideas that make a digital gradient look considered.
- A gradient inspired by colour field painting works best with two or three close colours, soft edges and plenty of uninterrupted space.

**Color field painting** is a kind of abstract painting that emerged in the United States from the late 1940s, in which large areas of nearly flat colour fill the canvas and become the subject. Mark Rothko, Barnett Newman and Clyfford Still led the first generation; Helen Frankenthaler, Morris Louis and Kenneth Noland pushed it further in the 1950s and 1960s. Their discoveries about soft edges, scale and layered colour are, almost exactly, the craft of making a good modern gradient.

## Colour field painting explained

It grew out of Abstract Expressionism in New York, alongside the energetic drip and gesture painting of artists like Jackson Pollock. Where gesture painters made the brushstroke the subject, colour field painters did nearly the opposite: they quietened the surface so colour itself could do the work. The canvases were often very large, meant to be seen up close, so that colour filled your vision.

The critic Clement Greenberg championed the later, cooler strand of the movement, and in 1964 organised an exhibition called Post-Painterly Abstraction that included many of its painters. The labels overlap, and the artists themselves often resisted them, but the shared idea is clear: colour as the whole event.

## The painters and what each one did

| Painter | Signature approach | What a designer can take |
| --- | --- | --- |
| Mark Rothko | Soft edged rectangles stacked on a coloured ground, built from thin layers | Soft edges and layered translucency |
| Barnett Newman | Vast fields cut by narrow vertical bands he called zips | One precise line can organise a huge surface |
| Clyfford Still | Jagged, flame like areas of colour that seem to tear across the canvas | Irregular edges add tension to calm colour |
| Helen Frankenthaler | Thinned paint poured onto unprimed canvas so it soaked in, her soak stain method | Colour that feels absorbed, not applied |
| Morris Louis | Veils and rivulets of stained colour flowing down the canvas | Direction through flow rather than lines |
| Kenneth Noland | Targets, chevrons and stripes of clean, stained colour | Geometry and colour can share one surface |

Six painters most associated with colour field painting. Search for their work in museum collections: reproductions on screen are the closest a gradient designer gets to the source.

Rothko's work is the most famous example. From around 1950 his paintings settled into two or three blurred rectangles hovering on a coloured ground. The Rothko Chapel in Houston, which opened in 1971, houses a set of his large, dark late paintings. Frankenthaler's 1952 painting Mountains and Sea, made with her soak stain method, influenced Louis and Noland, who went on to develop their own stained canvases.

## What colour field painting teaches about gradients

Most generic gradients fail in exactly the ways these painters avoided: too many colours, harsh transitions, no breathing room. Their lessons translate directly.

### Colour field painting

- Two or three colours per canvas
- Feathered edges where fields meet
- Thin layers that let lower colours glow through
- Huge scale, nothing else competing
- Colour chosen for how it changes its neighbour

### In a modern gradient

- A ground plus two close tones, not a rainbow
- Long, soft transitions instead of sharp stops
- Stacked layers with partial transparency
- Full bleed surfaces with words kept small
- Neighbours that blend cleanly, one accent apart

The last point matters most. Colour changes depending on what surrounds it, a principle explored at length in [color theory](https://gradiently.design/guide/color-theory-basics). A deep red beside orange glows; the same red beside grey looks brown. Colour field painters chose their neighbours with care, and a good gradient does the same. [Analogous colors](https://gradiently.design/guide/analogous-colors) gives a reliable method for picking neighbours that blend cleanly.

## Colour field inspired gradients

These gradients borrow the principles, not the paintings. They are studies in the spirit of the movement, made with a single CSS value each. [Gradient art](https://gradiently.design/guide/gradient-art) and [abstract art ideas](https://gradiently.design/guide/abstract-art-ideas) take the same thinking further.

- Two soft fields, stacked: `linear-gradient(180deg, #5a1a18 0%, #5a1a18 6%, #e0662a 13%, #e8742f 40%, #5a1a18 48%, #5a1a18 52%, #2a0d0e 59%, #2a0d0e 88%, #5a1a18 95%, #5a1a18 100%)`
- A single vertical zip: `linear-gradient(90deg, #7d1b1f 0%, #7d1b1f 61%, #f0d48a 61%, #f0d48a 62.5%, #7d1b1f 62.5%, #7d1b1f 100%)`
- Stain on raw canvas: `radial-gradient(ellipse 55% 45% at 38% 42%, #7fa7d1 0%, #b9cde0 40%, #ede4d3 75%)`
- Night blue, layered: `linear-gradient(180deg, #1c2340 0%, #1c2340 10%, #39457a 22%, #39457a 55%, #141a30 68%, #0d1120 100%)`

Stacked soft fields, a hard zip, a soaked stain and a dark layered study. Each uses no more than three colours.

To get closer to the hovering rectangles, with a margin of ground all around and edges that blur, layer real elements instead of a single gradient. This CSS draws two softly edged fields floating on a coloured ground.

```css
.canvas {
  position: relative;
  aspect-ratio: 3 / 4;
  background: #5a1a18; /* the ground */
  overflow: hidden;
}

.field {
  position: absolute;
  left: 9%;
  right: 9%;
  border-radius: 2px;
  filter: blur(6px);
}

.field.top {
  top: 7%;
  height: 40%;
  background: linear-gradient(180deg, #e8742f, #d65f25);
  opacity: 0.92;
}

.field.bottom {
  top: 53%;
  height: 38%;
  background: linear-gradient(180deg, #2a0d0e, #3a1312);
  opacity: 0.95;
}
```

Two fields on a ground. The blur feathers the edges and the slight transparency lets the ground warm each field, a digital echo of thin layered paint.

## Using the idea in design today

Colour field thinking suits anything that needs to feel calm and serious: gallery invitations, book covers, album art, a hero section with one short line. Keep words small and off to one side, so the colour stays the main event. [Art gallery marketing](https://gradiently.design/guide/art-gallery-marketing) shows how galleries use this restraint on social, and a light grain, covered in [grainy gradients](https://gradiently.design/guide/grainy-gradients), restores some of the surface a painting has.

A portrait gallery invitation with a small line of text on a large, softly layered field of colour

A gallery post in the colour field spirit: one surface, one small line, nothing else asking for attention.

Gradiently's Marks are built on similar thinking: a small family of colours, soft light and a material, rendered live behind whatever you design and moving their calmest area behind your words. Each one is checked against every other so no two look alike, which is a fair aim for anything inspired by painters who spent years finding a look of their own.

## FAQ

### What is color field painting?

A style of abstract painting that emerged in the United States from the late 1940s, in which large areas of nearly flat colour fill the canvas and become the subject.

### Who are the main color field painters?

Mark Rothko, Barnett Newman and Clyfford Still in the first generation, followed by Helen Frankenthaler, Morris Louis, Kenneth Noland and others.

### Is Mark Rothko a color field painter?

Yes. His mature paintings of soft edged rectangles stacked on a coloured ground are the best known examples of colour field painting, although he disliked labels for his work.

### How do I make a Rothko style gradient?

Use a coloured ground with two or three soft edged bands of close colours, feathered where they meet. Layering blurred, slightly transparent shapes gets closer than a single gradient.
