# Gray and white linear swatches

Gray and white linear swatches with 32 colors: #c6c5c1, #c7c6c2, #c8c7c3, #cac9c5, #cbcac7, #cdccc9, #cfcecb, #d1d0cd, #d3d2cf, #d5d4d1, #d7d6d3, #d9d8d6, #dbdad8, #dddcda, #dfdedc, #e1e0dd, #e3e2df, #e4e3e0, #e6e5e1, #e8e7e3, #eae8e4, #ebeae5, #edebe6, #efede7, #f0eee8, #f2efe9, #f3f1ea, #f5f2eb, #f6f3ec, #f7f4ed, #f8f5ed, #f9f6ee. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kS0QRBc4G_3uEP4`
- Page: https://grabient.com/kS0QRBc4G_3uEP4?style=linearSwatches&steps=32
- Drawn as: linear swatches, 32 steps, 90 degrees
- Kinds: neutral, light
- Hues: achromatic
- Contrast of its darkest and lightest colors: 1.5 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 | `#c6c5c1` | `oklch(82.28% 0.0055 91.41)` | Fortitude | black, 12.1 to 1 |
| 2 | `#c7c6c2` | `oklch(82.60% 0.0054 91.37)` | Brume | black, 12.2 to 1 |
| 3 | `#c8c7c3` | `oklch(82.99% 0.0053 91.34)` | Bleaches | black, 12.4 to 1 |
| 4 | `#cac9c5` | `oklch(83.45% 0.0052 91.30)` | Gentle Rain | black, 12.6 to 1 |
| 5 | `#cbcac7` | `oklch(83.96% 0.0050 91.26)` | Gentle Rain | black, 12.8 to 1 |
| 6 | `#cdccc9` | `oklch(84.52% 0.0049 91.22)` | Passive | black, 13 to 1 |
| 7 | `#cfcecb` | `oklch(85.12% 0.0047 91.17)` | Pewter Vase | black, 13.3 to 1 |
| 8 | `#d1d0cd` | `oklch(85.74% 0.0045 91.12)` | Halation | black, 13.6 to 1 |
| 9 | `#d3d2cf` | `oklch(86.38% 0.0044 91.06)` | Thundersnow | black, 13.8 to 1 |
| 10 | `#d5d4d1` | `oklch(87.04% 0.0042 91.00)` | Light Bleaches | black, 14.1 to 1 |
| 11 | `#d7d6d3` | `oklch(87.69% 0.0041 90.92)` | Woodland Wildflower | black, 14.4 to 1 |
| 12 | `#d9d8d6` | `oklch(88.34% 0.0040 90.84)` | Winter Morn | black, 14.7 to 1 |
| 13 | `#dbdad8` | `oklch(88.98% 0.0039 90.75)` | Subtle Touch | black, 15 to 1 |
| 14 | `#dddcda` | `oklch(89.59% 0.0039 90.65)` | Grey Ghost | black, 15.3 to 1 |
| 15 | `#dfdedc` | `oklch(90.16% 0.0039 90.54)` | White Lie | black, 15.6 to 1 |
| 16 | `#e1e0dd` | `oklch(90.70% 0.0041 90.42)` | Ghosted | black, 15.9 to 1 |
| 17 | `#e3e2df` | `oklch(91.19% 0.0042 90.28)` | Spilled Cappuccino | black, 16.1 to 1 |
| 18 | `#e4e3e0` | `oklch(91.67% 0.0045 90.11)` | Arctic Cotton | black, 16.4 to 1 |
| 19 | `#e6e5e1` | `oklch(92.16% 0.0049 89.92)` | Apollo Landing | black, 16.6 to 1 |
| 20 | `#e8e7e3` | `oklch(92.65% 0.0053 89.71)` | Cat’s Cream | black, 16.9 to 1 |
| 21 | `#eae8e4` | `oklch(93.13% 0.0057 89.49)` | Faded Grey | black, 17.1 to 1 |
| 22 | `#ebeae5` | `oklch(93.61% 0.0062 89.25)` | Blanco | black, 17.4 to 1 |
| 23 | `#edebe6` | `oklch(94.08% 0.0068 89.01)` | Sweet Vanilla | black, 17.6 to 1 |
| 24 | `#efede7` | `oklch(94.53% 0.0074 88.76)` | Hacienda White | black, 17.8 to 1 |
| 25 | `#f0eee8` | `oklch(94.96% 0.0079 88.51)` | Cloud Dancer | black, 18.1 to 1 |
| 26 | `#f2efe9` | `oklch(95.37% 0.0085 88.27)` | Fuji Snow | black, 18.3 to 1 |
| 27 | `#f3f1ea` | `oklch(95.76% 0.0090 88.04)` | Pearl Sugar | black, 18.5 to 1 |
| 28 | `#f5f2eb` | `oklch(96.12% 0.0095 87.82)` | Bit of Sugar | black, 18.7 to 1 |
| 29 | `#f6f3ec` | `oklch(96.46% 0.0100 87.63)` | Decorator White | black, 18.9 to 1 |
| 30 | `#f7f4ed` | `oklch(96.76% 0.0104 87.45)` | Crystal Cut | black, 19.1 to 1 |
| 31 | `#f8f5ed` | `oklch(97.02% 0.0108 87.30)` | Snow Day | black, 19.2 to 1 |
| 32 | `#f9f6ee` | `oklch(97.24% 0.0110 87.18)` | Foggy Pith | black, 19.3 to 1 |

## CSS

```css
background: linear-gradient(90deg, #c6c5c1 0.000% 3.125%, #c7c6c2 3.125% 6.250%, #c8c7c3 6.250% 9.375%, #cac9c5 9.375% 12.500%, #cbcac7 12.500% 15.625%, #cdccc9 15.625% 18.750%, #cfcecb 18.750% 21.875%, #d1d0cd 21.875% 25.000%, #d3d2cf 25.000% 28.125%, #d5d4d1 28.125% 31.250%, #d7d6d3 31.250% 34.375%, #d9d8d6 34.375% 37.500%, #dbdad8 37.500% 40.625%, #dddcda 40.625% 43.750%, #dfdedc 43.750% 46.875%, #e1e0dd 46.875% 50.000%, #e3e2df 50.000% 53.125%, #e4e3e0 53.125% 56.250%, #e6e5e1 56.250% 59.375%, #e8e7e3 59.375% 62.500%, #eae8e4 62.500% 65.625%, #ebeae5 65.625% 68.750%, #edebe6 68.750% 71.875%, #efede7 71.875% 75.000%, #f0eee8 75.000% 78.125%, #f2efe9 78.125% 81.250%, #f3f1ea 81.250% 84.375%, #f5f2eb 84.375% 87.500%, #f6f3ec 87.500% 90.625%, #f7f4ed 90.625% 93.750%, #f8f5ed 93.750% 96.875%, #f9f6ee 96.875% 100.000%);
background: linear-gradient(90deg, oklch(82.28% 0.0055 91.41) 0.000% 3.125%, oklch(82.60% 0.0054 91.37) 3.125% 6.250%, oklch(82.99% 0.0053 91.34) 6.250% 9.375%, oklch(83.45% 0.0052 91.30) 9.375% 12.500%, oklch(83.96% 0.0050 91.26) 12.500% 15.625%, oklch(84.52% 0.0049 91.22) 15.625% 18.750%, oklch(85.12% 0.0047 91.17) 18.750% 21.875%, oklch(85.74% 0.0045 91.12) 21.875% 25.000%, oklch(86.38% 0.0044 91.06) 25.000% 28.125%, oklch(87.04% 0.0042 91.00) 28.125% 31.250%, oklch(87.69% 0.0041 90.92) 31.250% 34.375%, oklch(88.34% 0.0040 90.84) 34.375% 37.500%, oklch(88.98% 0.0039 90.75) 37.500% 40.625%, oklch(89.59% 0.0039 90.65) 40.625% 43.750%, oklch(90.16% 0.0039 90.54) 43.750% 46.875%, oklch(90.70% 0.0041 90.42) 46.875% 50.000%, oklch(91.19% 0.0042 90.28) 50.000% 53.125%, oklch(91.67% 0.0045 90.11) 53.125% 56.250%, oklch(92.16% 0.0049 89.92) 56.250% 59.375%, oklch(92.65% 0.0053 89.71) 59.375% 62.500%, oklch(93.13% 0.0057 89.49) 62.500% 65.625%, oklch(93.61% 0.0062 89.25) 65.625% 68.750%, oklch(94.08% 0.0068 89.01) 68.750% 71.875%, oklch(94.53% 0.0074 88.76) 71.875% 75.000%, oklch(94.96% 0.0079 88.51) 75.000% 78.125%, oklch(95.37% 0.0085 88.27) 78.125% 81.250%, oklch(95.76% 0.0090 88.04) 81.250% 84.375%, oklch(96.12% 0.0095 87.82) 84.375% 87.500%, oklch(96.46% 0.0100 87.63) 87.500% 90.625%, oklch(96.76% 0.0104 87.45) 90.625% 93.750%, oklch(97.02% 0.0108 87.30) 93.750% 96.875%, oklch(97.24% 0.0110 87.18) 96.875% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.823 | 0.006 | 91.4 |
| 2 | 0.909 | 0.004 | 90.3 |
| 3 | 0.972 | 0.011 | 87.2 |

## In these collections

- [Gray gradients](https://grabient.com/gray-gradients)
- [Muted swatches](https://grabient.com/muted-swatches)
- [Elegant swatches](https://grabient.com/elegant-swatches)

## Other forms

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