# Violet gray charcoal rings

Black to gray linear gradient with 40 colors: #141318, #1c1a1f, #27252a, #363237, #474247, #5a5358, #6f676b, #847b7e, #998f91, #aea3a4, #c1b6b5, #d2c6c5, #dfd3d2, #e9dcdb, #eee2e1, #f0e4e5, #efe3e6, #eae0e5, #e4dbe2, #dbd6de, #d2cfd8, #c8c9d1, #bfc2ca, #b7bcc3, #b1b7bd, #adb4b8, #abb2b5, #abb3b5, #acb4b5, #aeb5b7, #b1b8b9, #b4bbbc, #b8bebf, #bcc1c2, #c0c5c6, #c3c8c9, #c7cbcd, #cacecf, #cdd1d2, #cfd2d3. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Black to gray linear gradient
- Seed: `kUMAfR8wVKeCDrPtgb8A`
- Page: https://grabient.com/kUMAfR8wVKeCDrPtgb8A?steps=40&angle=135
- Drawn as: linear gradient, 40 steps, 135 degrees
- Kinds: light center, neutral
- Hues: achromatic
- Contrast of its darkest and lightest colors: 14.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 | `#141318` | `oklch(18.90% 0.0096 294.61)` | Kettle Black | white, 18.5 to 1 |
| 2 | `#1c1a1f` | `oklch(22.30% 0.0099 299.21)` | Gluon Grey | white, 17.2 to 1 |
| 3 | `#27252a` | `oklch(26.84% 0.0101 305.87)` | Darth Vader | white, 15.1 to 1 |
| 4 | `#363237` | `oklch(32.31% 0.0105 314.14)` | Jet Black | white, 12.5 to 1 |
| 5 | `#474247` | `oklch(38.49% 0.0109 323.55)` | Nine Iron | white, 9.8 to 1 |
| 6 | `#5a5358` | `oklch(45.16% 0.0113 333.64)` | Bittersweet Molasses | white, 7.4 to 1 |
| 7 | `#6f676b` | `oklch(52.12% 0.0118 343.94)` | Double Infinity | white, 5.5 to 1 |
| 8 | `#847b7e` | `oklch(59.14% 0.0122 354.00)` | Sensuous Grey | black, 5.1 to 1 |
| 9 | `#998f91` | `oklch(66.01% 0.0126 3.36)` | Ash Pink | black, 6.7 to 1 |
| 10 | `#aea3a4` | `oklch(72.51% 0.0130 11.54)` | Quest Grey | black, 8.5 to 1 |
| 11 | `#c1b6b5` | `oklch(78.43% 0.0133 18.10)` | Queen Anne Lilac | black, 10.5 to 1 |
| 12 | `#d2c6c5` | `oklch(83.56% 0.0136 22.57)` | Aurora Grey | black, 12.6 to 1 |
| 13 | `#dfd3d2` | `oklch(87.67% 0.0137 24.48)` | Pearl Rose | black, 14.4 to 1 |
| 14 | `#e9dcdb` | `oklch(90.55% 0.0138 23.38)` | Homoeopathic Rose | black, 15.7 to 1 |
| 15 | `#eee2e1` | `oklch(92.19% 0.0137 18.78)` | Shattered Porcelain | black, 16.5 to 1 |
| 16 | `#f0e4e5` | `oklch(92.81% 0.0136 10.87)` | Venus Pink | black, 16.9 to 1 |
| 17 | `#efe3e6` | `oklch(92.57% 0.0134 0.20)` | Dulcet Pink | black, 16.7 to 1 |
| 18 | `#eae0e5` | `oklch(91.61% 0.0132 347.32)` | Dainty Flower | black, 16.2 to 1 |
| 19 | `#e4dbe2` | `oklch(90.10% 0.0129 332.79)` | Violet Vapour | black, 15.5 to 1 |
| 20 | `#dbd6de` | `oklch(88.17% 0.0125 317.14)` | Violet Whimsey | black, 14.6 to 1 |
| 21 | `#d2cfd8` | `oklch(85.99% 0.0121 300.94)` | Jam Session | black, 13.6 to 1 |
| 22 | `#c8c9d1` | `oklch(83.71% 0.0117 284.72)` | Sharp Grey | black, 12.7 to 1 |
| 23 | `#bfc2ca` | `oklch(81.46% 0.0113 269.05)` | Slipper Satin | black, 11.8 to 1 |
| 24 | `#b7bcc3` | `oklch(79.42% 0.0109 254.46)` | Silver Springs | black, 11 to 1 |
| 25 | `#b1b7bd` | `oklch(77.72% 0.0104 241.52)` | Grey Pearl Sand | black, 10.4 to 1 |
| 26 | `#adb4b8` | `oklch(76.53% 0.0100 230.77)` | Astroscopus Grey | black, 9.9 to 1 |
| 27 | `#abb2b5` | `oklch(75.98% 0.0096 222.75)` | High Rise | black, 9.8 to 1 |
| 28 | `#abb3b5` | `oklch(75.99% 0.0093 217.14)` | High Rise | black, 9.8 to 1 |
| 29 | `#acb4b5` | `oklch(76.30% 0.0088 213.10)` | Nautical Star | black, 9.9 to 1 |
| 30 | `#aeb5b7` | `oklch(76.86% 0.0084 210.43)` | Astroscopus Grey | black, 10.1 to 1 |
| 31 | `#b1b8b9` | `oklch(77.64% 0.0079 208.93)` | Autumn Fog | black, 10.3 to 1 |
| 32 | `#b4bbbc` | `oklch(78.58% 0.0074 208.41)` | Marseilles | black, 10.7 to 1 |
| 33 | `#b8bebf` | `oklch(79.64% 0.0069 208.66)` | Wheels Up! | black, 11.1 to 1 |
| 34 | `#bcc1c2` | `oklch(80.76% 0.0064 209.48)` | Quest | black, 11.5 to 1 |
| 35 | `#c0c5c6` | `oklch(81.90% 0.0059 210.68)` | Galactic Tint | black, 12 to 1 |
| 36 | `#c3c8c9` | `oklch(83.01% 0.0055 212.06)` | Fireplace Kitten | black, 12.4 to 1 |
| 37 | `#c7cbcd` | `oklch(84.05% 0.0051 213.42)` | Porpoise Fin | black, 12.8 to 1 |
| 38 | `#cacecf` | `oklch(84.96% 0.0047 214.55)` | Whisper of Smoke | black, 13.2 to 1 |
| 39 | `#cdd1d2` | `oklch(85.70% 0.0044 215.26)` | Misty | black, 13.6 to 1 |
| 40 | `#cfd2d3` | `oklch(86.22% 0.0041 215.35)` | Fragile Blue | black, 13.8 to 1 |

## CSS

```css
background: linear-gradient(135deg, #141318 0.0%, #1c1a1f 2.6%, #27252a 5.1%, #363237 7.7%, #474247 10.3%, #5a5358 12.8%, #6f676b 15.4%, #847b7e 17.9%, #998f91 20.5%, #aea3a4 23.1%, #c1b6b5 25.6%, #d2c6c5 28.2%, #dfd3d2 30.8%, #e9dcdb 33.3%, #eee2e1 35.9%, #f0e4e5 38.5%, #efe3e6 41.0%, #eae0e5 43.6%, #e4dbe2 46.2%, #dbd6de 48.7%, #d2cfd8 51.3%, #c8c9d1 53.8%, #bfc2ca 56.4%, #b7bcc3 59.0%, #b1b7bd 61.5%, #adb4b8 64.1%, #abb2b5 66.7%, #abb3b5 69.2%, #acb4b5 71.8%, #aeb5b7 74.4%, #b1b8b9 76.9%, #b4bbbc 79.5%, #b8bebf 82.1%, #bcc1c2 84.6%, #c0c5c6 87.2%, #c3c8c9 89.7%, #c7cbcd 92.3%, #cacecf 94.9%, #cdd1d2 97.4%, #cfd2d3 100.0%);
background: linear-gradient(135deg in oklch, oklch(18.90% 0.0096 294.61) 0.0%, oklch(22.30% 0.0099 299.21) 2.6%, oklch(26.84% 0.0101 305.87) 5.1%, oklch(32.31% 0.0105 314.14) 7.7%, oklch(38.49% 0.0109 323.55) 10.3%, oklch(45.16% 0.0113 333.64) 12.8%, oklch(52.12% 0.0118 343.94) 15.4%, oklch(59.14% 0.0122 354.00) 17.9%, oklch(66.01% 0.0126 3.36) 20.5%, oklch(72.51% 0.0130 11.54) 23.1%, oklch(78.43% 0.0133 18.10) 25.6%, oklch(83.56% 0.0136 22.57) 28.2%, oklch(87.67% 0.0137 24.48) 30.8%, oklch(90.55% 0.0138 23.38) 33.3%, oklch(92.19% 0.0137 18.78) 35.9%, oklch(92.81% 0.0136 10.87) 38.5%, oklch(92.57% 0.0134 0.20) 41.0%, oklch(91.61% 0.0132 347.32) 43.6%, oklch(90.10% 0.0129 332.79) 46.2%, oklch(88.17% 0.0125 317.14) 48.7%, oklch(85.99% 0.0121 300.94) 51.3%, oklch(83.71% 0.0117 284.72) 53.8%, oklch(81.46% 0.0113 269.05) 56.4%, oklch(79.42% 0.0109 254.46) 59.0%, oklch(77.72% 0.0104 241.52) 61.5%, oklch(76.53% 0.0100 230.77) 64.1%, oklch(75.98% 0.0096 222.75) 66.7%, oklch(75.99% 0.0093 217.14) 69.2%, oklch(76.30% 0.0088 213.10) 71.8%, oklch(76.86% 0.0084 210.43) 74.4%, oklch(77.64% 0.0079 208.93) 76.9%, oklch(78.58% 0.0074 208.41) 79.5%, oklch(79.64% 0.0069 208.66) 82.1%, oklch(80.76% 0.0064 209.48) 84.6%, oklch(81.90% 0.0059 210.68) 87.2%, oklch(83.01% 0.0055 212.06) 89.7%, oklch(84.05% 0.0051 213.42) 92.3%, oklch(84.96% 0.0047 214.55) 94.9%, oklch(85.70% 0.0044 215.26) 97.4%, oklch(86.22% 0.0041 215.35) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.189 | 0.01 | 294.6 |
| 2 | 0.906 | 0.014 | 383.4 |
| 3 | 0.76 | 0.01 | 222.8 |
| 4 | 0.862 | 0.004 | 215.4 |

## In these collections

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

## Other forms

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