# Deep cyan, sage and terracotta school uniform

The Deep cyan, sage and terracotta school uniform brings together blue, teal, green, light green, and orange. The colors span a moderate lightness range, combining restrained color with clear contrast. Its balanced and composed character suits stationery systems and print layouts. Its darkest tone is blue, and its lightest tone is light green.

- Also called: Navy, teal, gray and brown linear gradient
- Seed: `kWXCKlxJe71iXvLfkDmVpi3Q`
- Page: https://grabient.com/kWXCKlxJe71iXvLfkDmVpi3Q?steps=32&angle=180
- Drawn as: linear gradient, 32 steps, 180 degrees
- Kinds: dark to light
- Hues: wide
- Contrast of its darkest and lightest colors: 4.8 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 | `#224252` | `oklch(36.22% 0.0469 232.73)` | Reflecting Pond | white, 10.6 to 1 |
| 2 | `#244656` | `oklch(37.65% 0.0484 229.89)` | Rainstorm | white, 10 to 1 |
| 3 | `#264c5b` | `oklch(39.58% 0.0506 226.03)` | Deep Sea Blue | white, 9.2 to 1 |
| 4 | `#285361` | `oklch(41.88% 0.0533 221.43)` | Blue Bayberry | white, 8.3 to 1 |
| 5 | `#2b5b68` | `oklch(44.42% 0.0562 216.37)` | Night Shift | white, 7.4 to 1 |
| 6 | `#2e646e` | `oklch(47.08% 0.0590 211.11)` | Pedigree | white, 6.6 to 1 |
| 7 | `#326d74` | `oklch(49.72% 0.0616 205.92)` | Lakelike | white, 5.9 to 1 |
| 8 | `#377579` | `oklch(52.23% 0.0637 201.09)` | Ming | white, 5.2 to 1 |
| 9 | `#3d7c7d` | `oklch(54.48% 0.0650 196.88)` | Blue Venus | white, 4.8 to 1 |
| 10 | `#438381` | `oklch(56.70% 0.0660 193.30)` | Emu Egg | black, 4.7 to 1 |
| 11 | `#4a8a86` | `oklch(58.96% 0.0667 190.13)` | Evora | black, 5.2 to 1 |
| 12 | `#51918b` | `oklch(61.20% 0.0671 187.17)` | Green Agate | black, 5.7 to 1 |
| 13 | `#58988f` | `oklch(63.38% 0.0672 184.17)` | Martian Cerulean | black, 6.2 to 1 |
| 14 | `#609e93` | `oklch(65.43% 0.0669 180.94)` | Treasure Isle | black, 6.8 to 1 |
| 15 | `#68a496` | `oklch(67.31% 0.0663 177.25)` | Harmony in Green | black, 7.3 to 1 |
| 16 | `#70a997` | `oklch(68.96% 0.0654 172.89)` | Peacock Silk | black, 7.7 to 1 |
| 17 | `#78ad98` | `oklch(70.35% 0.0639 167.69)` | Dusty Jade Green | black, 8.2 to 1 |
| 18 | `#81b098` | `oklch(71.59% 0.0614 161.90)` | Covent Garden | black, 8.5 to 1 |
| 19 | `#8ab297` | `oklch(72.66% 0.0581 155.63)` | Morris Artichoke | black, 8.8 to 1 |
| 20 | `#92b497` | `oklch(73.57% 0.0544 148.90)` | Liebermann Green | black, 9.1 to 1 |
| 21 | `#9ab497` | `oklch(74.30% 0.0507 141.79)` | Dew Green | black, 9.3 to 1 |
| 22 | `#a1b596` | `oklch(74.82% 0.0475 134.32)` | Soap Green | black, 9.5 to 1 |
| 23 | `#a7b495` | `oklch(75.13% 0.0452 126.55)` | Mow the Lawn | black, 9.6 to 1 |
| 24 | `#abb394` | `oklch(75.21% 0.0441 118.53)` | Cottage Hill | black, 9.6 to 1 |
| 25 | `#afb190` | `oklch(74.98% 0.0447 109.88)` | That’s Atomic | black, 9.5 to 1 |
| 26 | `#b2ad8b` | `oklch(74.31% 0.0469 99.87)` | Underhive Ash | black, 9.2 to 1 |
| 27 | `#b5a885` | `oklch(73.32% 0.0501 89.06)` | Barbados Beige | black, 8.8 to 1 |
| 28 | `#b8a17f` | `oklch(72.15% 0.0540 78.03)` | Montecito | black, 8.4 to 1 |
| 29 | `#ba9b7b` | `oklch(70.92% 0.0581 67.37)` | Key to the City | black, 8 to 1 |
| 30 | `#bc9478` | `oklch(69.75% 0.0620 57.68)` | Sturdy Bronze | black, 7.6 to 1 |
| 31 | `#bd8f77` | `oklch(68.77% 0.0653 49.55)` | Copper Lake | black, 7.3 to 1 |
| 32 | `#bd8c77` | `oklch(68.11% 0.0675 43.58)` | Suntan Glow | black, 7.1 to 1 |

## CSS

```css
background: linear-gradient(180deg, #224252 0.0%, #244656 3.2%, #264c5b 6.5%, #285361 9.7%, #2b5b68 12.9%, #2e646e 16.1%, #326d74 19.4%, #377579 22.6%, #3d7c7d 25.8%, #438381 29.0%, #4a8a86 32.3%, #51918b 35.5%, #58988f 38.7%, #609e93 41.9%, #68a496 45.2%, #70a997 48.4%, #78ad98 51.6%, #81b098 54.8%, #8ab297 58.1%, #92b497 61.3%, #9ab497 64.5%, #a1b596 67.7%, #a7b495 71.0%, #abb394 74.2%, #afb190 77.4%, #b2ad8b 80.6%, #b5a885 83.9%, #b8a17f 87.1%, #ba9b7b 90.3%, #bc9478 93.5%, #bd8f77 96.8%, #bd8c77 100.0%);
background: linear-gradient(180deg in oklch, oklch(36.22% 0.0469 232.73) 0.0%, oklch(37.65% 0.0484 229.89) 3.2%, oklch(39.58% 0.0506 226.03) 6.5%, oklch(41.88% 0.0533 221.43) 9.7%, oklch(44.42% 0.0562 216.37) 12.9%, oklch(47.08% 0.0590 211.11) 16.1%, oklch(49.72% 0.0616 205.92) 19.4%, oklch(52.23% 0.0637 201.09) 22.6%, oklch(54.48% 0.0650 196.88) 25.8%, oklch(56.70% 0.0660 193.30) 29.0%, oklch(58.96% 0.0667 190.13) 32.3%, oklch(61.20% 0.0671 187.17) 35.5%, oklch(63.38% 0.0672 184.17) 38.7%, oklch(65.43% 0.0669 180.94) 41.9%, oklch(67.31% 0.0663 177.25) 45.2%, oklch(68.96% 0.0654 172.89) 48.4%, oklch(70.35% 0.0639 167.69) 51.6%, oklch(71.59% 0.0614 161.90) 54.8%, oklch(72.66% 0.0581 155.63) 58.1%, oklch(73.57% 0.0544 148.90) 61.3%, oklch(74.30% 0.0507 141.79) 64.5%, oklch(74.82% 0.0475 134.32) 67.7%, oklch(75.13% 0.0452 126.55) 71.0%, oklch(75.21% 0.0441 118.53) 74.2%, oklch(74.98% 0.0447 109.88) 77.4%, oklch(74.31% 0.0469 99.87) 80.6%, oklch(73.32% 0.0501 89.06) 83.9%, oklch(72.15% 0.0540 78.03) 87.1%, oklch(70.92% 0.0581 67.37) 90.3%, oklch(69.75% 0.0620 57.68) 93.5%, oklch(68.77% 0.0653 49.55) 96.8%, oklch(68.11% 0.0675 43.58) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.362 | 0.047 | 232.7 |
| 2 | 0.539 | 0.065 | 197.9 |
| 3 | 0.697 | 0.065 | 170.4 |
| 4 | 0.752 | 0.044 | 116.5 |
| 5 | 0.681 | 0.068 | 43.6 |

## In these collections

- [School uniform](https://grabient.com/school-uniform)

## Other forms

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