# Field Note Stripe Set

Five diagonal bands move from aged paper through olive, brick red, notebook blue, and charcoal. The muted pigments resemble colored pencil, stamped ink, and worn folder stock, giving composition-book doodles a more earthy option for section tabs, hand-drawn labels, page borders, and classroom poster accents.

- Also called: Beige, olive, blue and black linear swatches
- Seed: `kW6B06xZpD0mstrCna3pATFg`
- Page: https://grabient.com/kW6B06xZpD0mstrCna3pATFg?style=linearSwatches&steps=5&angle=60
- Drawn as: linear swatches, 5 steps, 60 degrees
- Hues: two-hue
- Contrast of its darkest and lightest colors: 11.1 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 | `#f0e1c5` | `oklch(91.34% 0.0400 82.27)` | Champagne Bliss | black, 16.2 to 1 |
| 2 | `#6f7644` | `oklch(54.72% 0.0717 115.02)` | Swamp Shrub | white, 4.8 to 1 |
| 3 | `#b65d43` | `oklch(57.87% 0.1226 36.83)` | Sun-Kissed Brick | black, 4.6 to 1 |
| 4 | `#3e6f96` | `oklch(52.36% 0.0813 244.65)` | National Anthem | white, 5.3 to 1 |
| 5 | `#2a292f` | `oklch(28.35% 0.0124 292.21)` | Jaguar | white, 14.4 to 1 |

## CSS

```css
background: linear-gradient(60deg, #f0e1c5 0.000% 20.000%, #6f7644 20.000% 40.000%, #b65d43 40.000% 60.000%, #3e6f96 60.000% 80.000%, #2a292f 80.000% 100.000%);
background: linear-gradient(60deg, oklch(91.34% 0.0400 82.27) 0.000% 20.000%, oklch(54.72% 0.0717 115.02) 20.000% 40.000%, oklch(57.87% 0.1226 36.83) 40.000% 60.000%, oklch(52.36% 0.0813 244.65) 60.000% 80.000%, oklch(28.35% 0.0124 292.21) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.913 | 0.04 | 82.3 |
| 2 | 0.547 | 0.072 | 115 |
| 3 | 0.579 | 0.123 | 36.8 |
| 4 | 0.524 | 0.081 | -115.3 |
| 5 | 0.283 | 0.012 | -67.8 |

## In these collections

- [Composition notebook doodles](https://grabient.com/composition-notebook-doodles)

## Other forms

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