# Yellow and blue cutout bands

Photocopy black and warm cream meet a sharp yellow and a clear blue in four broad diagonal bands. The paper neutral gives the two saturated inks room to stand apart, keeping the arrangement bold and easy to read. Use this zine palette for cutout lettering, independent publications, or graphic event posters.

- Also called: Black, beige, yellow and blue linear swatches
- Seed: `kUMgFMdA49mo9QVIKE_g`
- Page: https://grabient.com/kUMgFMdA49mo9QVIKE_g?style=linearSwatches&steps=4&angle=45
- Drawn as: linear swatches, 4 steps, 45 degrees
- Kinds: light center, vivid
- Hues: wide
- Contrast of its darkest and lightest colors: 14 to 1

## Colors

The name most people give each color, and the text color that reads on it with its contrast.

| Stop | Hex | OKLCH | Name | Text on it |
| --- | --- | --- | --- | --- |
| 1 | `#151515` | `oklch(19.69% 0.0014 106.87)` | Matt Black | white, 18.2 to 1 |
| 2 | `#eee1c6` | `oklch(91.34% 0.0386 86.80)` | Thatched Roof | black, 16.2 to 1 |
| 3 | `#e5c91b` | `oklch(83.46% 0.1681 98.42)` | Oh Em Ghee | black, 12.7 to 1 |
| 4 | `#1b80ad` | `oklch(56.69% 0.1102 233.69)` | Blue Bird Day | black, 4.7 to 1 |

## CSS

```css
background: linear-gradient(45deg, #151515 0.000% 25.000%, #eee1c6 25.000% 50.000%, #e5c91b 50.000% 75.000%, #1b80ad 75.000% 100.000%);
background: linear-gradient(45deg, oklch(19.69% 0.0014 106.87) 0.000% 25.000%, oklch(91.34% 0.0386 86.80) 25.000% 50.000%, oklch(83.46% 0.1681 98.42) 50.000% 75.000%, oklch(56.69% 0.1102 233.69) 75.000% 100.000%);
```

## Keyframes

4 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees.

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.197 | 0.001 | 106.9 |
| 2 | 0.913 | 0.039 | 86.8 |
| 3 | 0.835 | 0.168 | 98.4 |
| 4 | 0.567 | 0.11 | 233.7 |

## In these collections

- [Zine colors](https://grabient.com/zine-colors)

## Other forms

- [JSON](https://grabient.com/kUMgFMdA49mo9QVIKE_g.json?style=linearSwatches&steps=4&angle=45)
- [PNG](https://grabient.com/kUMgFMdA49mo9QVIKE_g.png?style=linearSwatches&steps=4&angle=45)
- [SVG](https://grabient.com/kUMgFMdA49mo9QVIKE_g.svg?style=linearSwatches&steps=4&angle=45)
- [CSS](https://grabient.com/kUMgFMdA49mo9QVIKE_g.css?style=linearSwatches&steps=4&angle=45)
- [ASE](https://grabient.com/kUMgFMdA49mo9QVIKE_g.ase?style=linearSwatches&steps=4&angle=45)
- [GPL](https://grabient.com/kUMgFMdA49mo9QVIKE_g.gpl?style=linearSwatches&steps=4&angle=45)
- [GRD](https://grabient.com/kUMgFMdA49mo9QVIKE_g.grd?style=linearSwatches&steps=4&angle=45)
- [Design tokens](https://grabient.com/kUMgFMdA49mo9QVIKE_g.tokens.json?style=linearSwatches&steps=4&angle=45)
- [Social card](https://grabient.com/api/og?seed=kUMgFMdA49mo9QVIKE_g&style=linearSwatches&steps=4&angle=45)
- [Palettes like this one](https://grabient.com/palettes?q=kUMgFMdA49mo9QVIKE_g)
- [Guide for agents](https://grabient.com/llms.txt)