# Near-black and orange back to school

The Near-black and orange back to school brings together dark teal, green, pale yellow, and orange. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits stationery systems and print layouts. Its darkest tone is dark teal, and its lightest tone is pale yellow.

- Also called: Black, dark green, gray and orange linear swatches
- Seed: `kYOReDo4--6yTP03lj_c4q3WY6PG`
- Page: https://grabient.com/kYOReDo4--6yTP03lj_c4q3WY6PG?style=linearSwatches&steps=6&angle=270
- Drawn as: linear swatches, 6 steps, 270 degrees
- Kinds: vivid, dark
- Hues: two-hue
- Contrast of its darkest and lightest colors: 12.9 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 | `#07201d` | `oklch(22.44% 0.0317 184.92)` | Stellar Explorer | white, 16.9 to 1 |
| 2 | `#0c3028` | `oklch(27.95% 0.0427 176.47)` | Fence Green | white, 14.3 to 1 |
| 3 | `#194337` | `oklch(35.04% 0.0524 171.18)` | MSU Green | white, 10.9 to 1 |
| 4 | `#2b5d4d` | `oklch(43.70% 0.0606 170.13)` | Old Money | white, 7.6 to 1 |
| 5 | `#e6e2cc` | `oklch(90.94% 0.0289 97.21)` | Canyon Echo | black, 16 to 1 |
| 6 | `#ffaa3f` | `oklch(80.31% 0.1532 67.63)` | Match Strike | black, 11 to 1 |

## CSS

```css
background: linear-gradient(270deg, #07201d 0.000% 16.667%, #0c3028 16.667% 33.333%, #194337 33.333% 50.000%, #2b5d4d 50.000% 66.667%, #e6e2cc 66.667% 83.333%, #ffaa3f 83.333% 100.000%);
background: linear-gradient(270deg, oklch(22.44% 0.0317 184.92) 0.000% 16.667%, oklch(27.95% 0.0427 176.47) 16.667% 33.333%, oklch(35.04% 0.0524 171.18) 33.333% 50.000%, oklch(43.70% 0.0606 170.13) 50.000% 66.667%, oklch(90.94% 0.0289 97.21) 66.667% 83.333%, oklch(80.31% 0.1532 67.63) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.224 | 0.032 | 184.9 |
| 2 | 0.28 | 0.043 | 176.5 |
| 3 | 0.35 | 0.052 | 171.2 |
| 4 | 0.437 | 0.061 | 170.1 |
| 5 | 0.909 | 0.029 | 97.2 |
| 6 | 0.803 | 0.16 | 67.6 |

## In these collections

- [Back to school swatches](https://grabient.com/back-to-school-swatches)

## Other forms

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