# Slate Office Light

The Stone, mauve and charcoal analog office nostalgia brings together light teal, blue, and gray. The colors span a moderate lightness range, combining restrained color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is blue, and its lightest tone is light teal.

- Also called: Monochrome gray and blue radial gradient
- Seed: `kWwxeVVJLCUARwQxicIswXHo`
- Page: https://grabient.com/kWwxeVVJLCUARwQxicIswXHo?style=radialGradient&steps=32&angle=315
- Drawn as: radial gradient, 32 steps, 315 degrees
- Kinds: light to dark, muted, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 4.7 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 | `#9db9bf` | `oklch(76.77% 0.0317 209.53)` | Windswept Clouds | black, 10.1 to 1 |
| 2 | `#9ab7bd` | `oklch(75.99% 0.0334 211.22)` | Peaceful Blue | black, 9.8 to 1 |
| 3 | `#95b4bc` | `oklch(75.00% 0.0358 213.55)` | Mohair Soft Blue Grey | black, 9.5 to 1 |
| 4 | `#8fb1ba` | `oklch(73.82% 0.0388 216.33)` | Lucy Blue | black, 9.1 to 1 |
| 5 | `#89adb8` | `oklch(72.49% 0.0419 219.36)` | Sebastian Inlet | black, 8.7 to 1 |
| 6 | `#83a8b6` | `oklch(71.02% 0.0450 222.45)` | Winter Twilight | black, 8.2 to 1 |
| 7 | `#7da3b3` | `oklch(69.45% 0.0477 225.39)` | Lake Winnipeg | black, 7.8 to 1 |
| 8 | `#789eb0` | `oklch(67.80% 0.0499 228.00)` | Blue Cascade | black, 7.3 to 1 |
| 9 | `#7299ac` | `oklch(66.10% 0.0512 230.07)` | Palace Intrigue | black, 6.8 to 1 |
| 10 | `#6d93a7` | `oklch(64.22% 0.0520 231.64)` | Architecture Blue | black, 6.3 to 1 |
| 11 | `#678ca1` | `oklch(62.14% 0.0524 232.86)` | Bermuda Grey | black, 5.8 to 1 |
| 12 | `#61869b` | `oklch(59.94% 0.0524 233.86)` | Seal Pup | black, 5.3 to 1 |
| 13 | `#5b7f94` | `oklch(57.69% 0.0520 234.77)` | Blue Heaven | black, 4.8 to 1 |
| 14 | `#55788d` | `oklch(55.46% 0.0513 235.72)` | Cayman Bay | white, 4.7 to 1 |
| 15 | `#507186` | `oklch(53.31% 0.0503 236.84)` | Inky Blue | white, 5.1 to 1 |
| 16 | `#4c6b80` | `oklch(51.31% 0.0490 238.26)` | Blue Loneliness | white, 5.6 to 1 |
| 17 | `#49667a` | `oklch(49.50% 0.0473 239.99)` | Gloomy Sea | white, 6 to 1 |
| 18 | `#466074` | `oklch(47.70% 0.0450 241.50)` | Eclipse Blue | white, 6.5 to 1 |
| 19 | `#435b6e` | `oklch(45.92% 0.0422 242.91)` | Infinite Deep Sea | white, 7.1 to 1 |
| 20 | `#415667` | `oklch(44.21% 0.0390 244.46)` | Alien | white, 7.6 to 1 |
| 21 | `#3f5162` | `oklch(42.63% 0.0356 246.39)` | Midnight Haze | white, 8.1 to 1 |
| 22 | `#3d4d5c` | `oklch(41.23% 0.0324 248.94)` | Cavalry | white, 8.7 to 1 |
| 23 | `#3d4958` | `oklch(40.05% 0.0293 252.33)` | Voltage | white, 9.1 to 1 |
| 24 | `#3c4654` | `oklch(39.15% 0.0267 256.82)` | Rhino | white, 9.5 to 1 |
| 25 | `#3d4451` | `oklch(38.60% 0.0246 262.92)` | Dark Crypt | white, 9.7 to 1 |
| 26 | `#3f4350` | `oklch(38.41% 0.0227 271.08)` | Madonna | white, 9.8 to 1 |
| 27 | `#41434f` | `oklch(38.51% 0.0210 280.62)` | Midnight Serenade | white, 9.8 to 1 |
| 28 | `#44434e` | `oklch(38.81% 0.0195 290.81)` | Night Grey | white, 9.7 to 1 |
| 29 | `#47434e` | `oklch(39.21% 0.0181 300.93)` | Ishtar | white, 9.5 to 1 |
| 30 | `#49444e` | `oklch(39.63% 0.0169 310.26)` | Ishtar | white, 9.4 to 1 |
| 31 | `#4b454d` | `oklch(39.97% 0.0160 318.08)` | Black Dahlia | white, 9.2 to 1 |
| 32 | `#4c454d` | `oklch(40.16% 0.0152 323.66)` | Black Dahlia | white, 9.2 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #9db9bf 0.0%, #9ab7bd 3.2%, #95b4bc 6.5%, #8fb1ba 9.7%, #89adb8 12.9%, #83a8b6 16.1%, #7da3b3 19.4%, #789eb0 22.6%, #7299ac 25.8%, #6d93a7 29.0%, #678ca1 32.3%, #61869b 35.5%, #5b7f94 38.7%, #55788d 41.9%, #507186 45.2%, #4c6b80 48.4%, #49667a 51.6%, #466074 54.8%, #435b6e 58.1%, #415667 61.3%, #3f5162 64.5%, #3d4d5c 67.7%, #3d4958 71.0%, #3c4654 74.2%, #3d4451 77.4%, #3f4350 80.6%, #41434f 83.9%, #44434e 87.1%, #47434e 90.3%, #49444e 93.5%, #4b454d 96.8%, #4c454d 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(76.77% 0.0317 209.53) 0.0%, oklch(75.99% 0.0334 211.22) 3.2%, oklch(75.00% 0.0358 213.55) 6.5%, oklch(73.82% 0.0388 216.33) 9.7%, oklch(72.49% 0.0419 219.36) 12.9%, oklch(71.02% 0.0450 222.45) 16.1%, oklch(69.45% 0.0477 225.39) 19.4%, oklch(67.80% 0.0499 228.00) 22.6%, oklch(66.10% 0.0512 230.07) 25.8%, oklch(64.22% 0.0520 231.64) 29.0%, oklch(62.14% 0.0524 232.86) 32.3%, oklch(59.94% 0.0524 233.86) 35.5%, oklch(57.69% 0.0520 234.77) 38.7%, oklch(55.46% 0.0513 235.72) 41.9%, oklch(53.31% 0.0503 236.84) 45.2%, oklch(51.31% 0.0490 238.26) 48.4%, oklch(49.50% 0.0473 239.99) 51.6%, oklch(47.70% 0.0450 241.50) 54.8%, oklch(45.92% 0.0422 242.91) 58.1%, oklch(44.21% 0.0390 244.46) 61.3%, oklch(42.63% 0.0356 246.39) 64.5%, oklch(41.23% 0.0324 248.94) 67.7%, oklch(40.05% 0.0293 252.33) 71.0%, oklch(39.15% 0.0267 256.82) 74.2%, oklch(38.60% 0.0246 262.92) 77.4%, oklch(38.41% 0.0227 271.08) 80.6%, oklch(38.51% 0.0210 280.62) 83.9%, oklch(38.81% 0.0195 290.81) 87.1%, oklch(39.21% 0.0181 300.93) 90.3%, oklch(39.63% 0.0169 310.26) 93.5%, oklch(39.97% 0.0160 318.08) 96.8%, oklch(40.16% 0.0152 323.66) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.768 | 0.032 | 209.5 |
| 2 | 0.665 | 0.051 | 229.6 |
| 3 | 0.504 | 0.048 | 239.1 |
| 4 | 0.39 | 0.026 | 258.1 |
| 5 | 0.402 | 0.015 | 323.7 |

## In these collections

- [Analog office nostalgia](https://grabient.com/analog-office-nostalgia)

## Other forms

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