# Cool gray linear gradient

Cool gray linear gradient with 32 colors: #4c5057, #4d5158, #4e5259, #50535b, #51555c, #53565e, #555860, #575a63, #595c65, #5b5e67, #5d606a, #5f626c, #61646f, #646771, #666973, #686b76, #6a6d78, #6c6f7b, #6e717d, #717380, #737683, #757886, #787b88, #7a7d8b, #7d808e, #7f8291, #818493, #838696, #858898, #878a9a, #888c9c, #898d9d. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kSbQm8Q4bBNIJQA`
- Page: https://grabient.com/kSbQm8Q4bBNIJQA?steps=32
- Drawn as: linear gradient, 32 steps, 90 degrees
- Kinds: neutral, cool
- Hues: achromatic
- Contrast of its darkest and lightest colors: 2.4 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 | `#4c5057` | `oklch(42.91% 0.0124 264.37)` | Abbey | white, 8.1 to 1 |
| 2 | `#4d5158` | `oklch(43.28% 0.0126 264.78)` | Water Ouzel | white, 8 to 1 |
| 3 | `#4e5259` | `oklch(43.72% 0.0128 265.29)` | Water Ouzel | white, 7.8 to 1 |
| 4 | `#50535b` | `oklch(44.23% 0.0131 265.90)` | Evening Cityscape | white, 7.6 to 1 |
| 5 | `#51555c` | `oklch(44.80% 0.0134 266.59)` | Coal Tipple | white, 7.5 to 1 |
| 6 | `#53565e` | `oklch(45.42% 0.0137 267.34)` | Coal Tipple | white, 7.3 to 1 |
| 7 | `#555860` | `oklch(46.08% 0.0141 268.13)` | Edge of Black | white, 7.1 to 1 |
| 8 | `#575a63` | `oklch(46.78% 0.0144 268.96)` | Midnight Badger | white, 6.8 to 1 |
| 9 | `#595c65` | `oklch(47.50% 0.0148 269.80)` | Blackish Grey | white, 6.6 to 1 |
| 10 | `#5b5e67` | `oklch(48.25% 0.0152 270.64)` | Blue Slate | white, 6.4 to 1 |
| 11 | `#5d606a` | `oklch(49.01% 0.0156 271.47)` | Script Ink | white, 6.2 to 1 |
| 12 | `#5f626c` | `oklch(49.79% 0.0160 272.25)` | Script Ink | white, 6 to 1 |
| 13 | `#61646f` | `oklch(50.56% 0.0165 272.99)` | Eventide | white, 5.8 to 1 |
| 14 | `#646771` | `oklch(51.32% 0.0169 273.66)` | Alley Cat | white, 5.6 to 1 |
| 15 | `#666973` | `oklch(52.07% 0.0173 274.25)` | Alley Cat | white, 5.5 to 1 |
| 16 | `#686b76` | `oklch(52.80% 0.0177 274.74)` | Blue Sari | white, 5.3 to 1 |
| 17 | `#6a6d78` | `oklch(53.51% 0.0181 275.12)` | Space Station | white, 5.1 to 1 |
| 18 | `#6c6f7b` | `oklch(54.26% 0.0186 275.42)` | Prediction | white, 5 to 1 |
| 19 | `#6e717d` | `oklch(55.05% 0.0190 275.66)` | Made in the Shade | white, 4.8 to 1 |
| 20 | `#717380` | `oklch(55.87% 0.0195 275.85)` | Overlook | white, 4.6 to 1 |
| 21 | `#737683` | `oklch(56.72% 0.0200 275.98)` | Purple Funk | black, 4.6 to 1 |
| 22 | `#757886` | `oklch(57.58% 0.0205 276.06)` | Infamous | black, 4.8 to 1 |
| 23 | `#787b88` | `oklch(58.44% 0.0211 276.11)` | Infamous | black, 4.9 to 1 |
| 24 | `#7a7d8b` | `oklch(59.29% 0.0216 276.13)` | Silver Surfer | black, 5.1 to 1 |
| 25 | `#7d808e` | `oklch(60.12% 0.0221 276.13)` | Blue Mood | black, 5.3 to 1 |
| 26 | `#7f8291` | `oklch(60.92% 0.0226 276.10)` | Deep Smoke Signal | black, 5.5 to 1 |
| 27 | `#818493` | `oklch(61.69% 0.0230 276.07)` | Clairvoyance | black, 5.6 to 1 |
| 28 | `#838696` | `oklch(62.40% 0.0235 276.04)` | Blue Jasmine | black, 5.8 to 1 |
| 29 | `#858898` | `oklch(63.06% 0.0239 276.00)` | Yin Hūi Silver | black, 5.9 to 1 |
| 30 | `#878a9a` | `oklch(63.64% 0.0242 275.98)` | Dusty Chimney | black, 6.1 to 1 |
| 31 | `#888c9c` | `oklch(64.15% 0.0246 275.98)` | Applause Please | black, 6.2 to 1 |
| 32 | `#898d9d` | `oklch(64.57% 0.0248 276.00)` | Applause Please | black, 6.3 to 1 |

## CSS

```css
background: linear-gradient(90deg, #4c5057 0.0%, #4d5158 3.2%, #4e5259 6.5%, #50535b 9.7%, #51555c 12.9%, #53565e 16.1%, #555860 19.4%, #575a63 22.6%, #595c65 25.8%, #5b5e67 29.0%, #5d606a 32.3%, #5f626c 35.5%, #61646f 38.7%, #646771 41.9%, #666973 45.2%, #686b76 48.4%, #6a6d78 51.6%, #6c6f7b 54.8%, #6e717d 58.1%, #717380 61.3%, #737683 64.5%, #757886 67.7%, #787b88 71.0%, #7a7d8b 74.2%, #7d808e 77.4%, #7f8291 80.6%, #818493 83.9%, #838696 87.1%, #858898 90.3%, #878a9a 93.5%, #888c9c 96.8%, #898d9d 100.0%);
background: linear-gradient(90deg in oklch, oklch(42.91% 0.0124 264.37) 0.0%, oklch(43.28% 0.0126 264.78) 3.2%, oklch(43.72% 0.0128 265.29) 6.5%, oklch(44.23% 0.0131 265.90) 9.7%, oklch(44.80% 0.0134 266.59) 12.9%, oklch(45.42% 0.0137 267.34) 16.1%, oklch(46.08% 0.0141 268.13) 19.4%, oklch(46.78% 0.0144 268.96) 22.6%, oklch(47.50% 0.0148 269.80) 25.8%, oklch(48.25% 0.0152 270.64) 29.0%, oklch(49.01% 0.0156 271.47) 32.3%, oklch(49.79% 0.0160 272.25) 35.5%, oklch(50.56% 0.0165 272.99) 38.7%, oklch(51.32% 0.0169 273.66) 41.9%, oklch(52.07% 0.0173 274.25) 45.2%, oklch(52.80% 0.0177 274.74) 48.4%, oklch(53.51% 0.0181 275.12) 51.6%, oklch(54.26% 0.0186 275.42) 54.8%, oklch(55.05% 0.0190 275.66) 58.1%, oklch(55.87% 0.0195 275.85) 61.3%, oklch(56.72% 0.0200 275.98) 64.5%, oklch(57.58% 0.0205 276.06) 67.7%, oklch(58.44% 0.0211 276.11) 71.0%, oklch(59.29% 0.0216 276.13) 74.2%, oklch(60.12% 0.0221 276.13) 77.4%, oklch(60.92% 0.0226 276.10) 80.6%, oklch(61.69% 0.0230 276.07) 83.9%, oklch(62.40% 0.0235 276.04) 87.1%, oklch(63.06% 0.0239 276.00) 90.3%, oklch(63.64% 0.0242 275.98) 93.5%, oklch(64.15% 0.0246 275.98) 96.8%, oklch(64.57% 0.0248 276.00) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.429 | 0.012 | 264.4 |
| 2 | 0.531 | 0.018 | 274.9 |
| 3 | 0.646 | 0.025 | 276 |

## In these collections

- [Cool gray gradients](https://grabient.com/cool-gray-gradients)

## Other forms

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