# Corduroy Olive Teal Stripes

Warm cream, burnt orange, olive green, and muted teal appear in broad diagonal bands. The earthy saturation and even lightness steps evoke 1970s corduroy, painted toys, and handmade household textiles. It works for vintage clothing shop graphics or crochet project covers that need a cozy retro palette with clear, reusable color blocks.

- Also called: Beige, orange, olive and teal linear swatches
- Seed: `kU5hxBzrG6E6nSO4kcpg`
- Page: https://grabient.com/kU5hxBzrG6E6nSO4kcpg?style=linearSwatches&steps=4&angle=135
- Drawn as: linear swatches, 4 steps, 135 degrees
- Kinds: light to dark, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 5.6 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 | `#e9e0c4` | `oklch(90.55% 0.0386 92.11)` | Sailcloth | black, 15.8 to 1 |
| 2 | `#c8663d` | `oklch(61.81% 0.1364 42.44)` | Hashut Copper | black, 5.4 to 1 |
| 3 | `#7f8e3e` | `oklch(61.81% 0.1075 118.53)` | Komatsuna Green | black, 5.8 to 1 |
| 4 | `#315c62` | `oklch(44.49% 0.0482 207.30)` | Arctic Nights | white, 7.4 to 1 |

## CSS

```css
background: linear-gradient(135deg, #e9e0c4 0.000% 25.000%, #c8663d 25.000% 50.000%, #7f8e3e 50.000% 75.000%, #315c62 75.000% 100.000%);
background: linear-gradient(135deg, oklch(90.55% 0.0386 92.11) 0.000% 25.000%, oklch(61.81% 0.1364 42.44) 25.000% 50.000%, oklch(61.81% 0.1075 118.53) 50.000% 75.000%, oklch(44.49% 0.0482 207.30) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.906 | 0.039 | 92.1 |
| 2 | 0.618 | 0.136 | 42.4 |
| 3 | 0.618 | 0.107 | 118.5 |
| 4 | 0.445 | 0.048 | 207.3 |

## In these collections

- [Throwback kid](https://grabient.com/throwback-kid)

## Other forms

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