# Slate Sage Marble Rings

These concentric rings move from charcoal and muted mauve through midnight blue, icy blue, and soft sage. The cool stone colors and alternating dark center give the palette a polished marble character. Use them for mineral inspired branding, elegant dashboards, editorial accents, or quiet interiors that need crisp contrast without bright saturation.

- Also called: Black, navy and gray radial swatches
- Seed: `kWQgSowQbMyCQNj0kzs3460Y`
- Page: https://grabient.com/kWQgSowQbMyCQNj0kzs3460Y?style=radialSwatches&steps=5&angle=0
- Drawn as: radial swatches, 5 steps, 0 degrees
- Kinds: muted
- Hues: wide
- Contrast of its darkest and lightest colors: 12.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 | `#222426` | `oklch(25.98% 0.0055 236.95)` | Verified Black | white, 15.5 to 1 |
| 2 | `#6f6369` | `oklch(51.18% 0.0179 345.80)` | Vintage Grape | white, 5.7 to 1 |
| 3 | `#182338` | `oklch(25.59% 0.0441 263.37)` | Kon | white, 15.7 to 1 |
| 4 | `#bfecfe` | `oklch(91.73% 0.0524 223.22)` | Blue Java Banana | black, 16.6 to 1 |
| 5 | `#a8b498` | `oklch(75.20% 0.0400 125.99)` | Mow the Lawn | black, 9.6 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #222426 0.000% 20.000%, #6f6369 20.000% 40.000%, #182338 40.000% 60.000%, #bfecfe 60.000% 80.000%, #a8b498 80.000% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(25.98% 0.0055 236.95) 0.000% 20.000%, oklch(51.18% 0.0179 345.80) 20.000% 40.000%, oklch(25.59% 0.0441 263.37) 40.000% 60.000%, oklch(91.73% 0.0524 223.22) 60.000% 80.000%, oklch(75.20% 0.0400 125.99) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.26 | 0.006 | 237 |
| 2 | 0.512 | 0.018 | 345.8 |
| 3 | 0.256 | 0.044 | 263.4 |
| 4 | 0.917 | 0.052 | 223.2 |
| 5 | 0.752 | 0.04 | 126 |

## In these collections

- [Marble swatches](https://grabient.com/marble-swatches)

## Other forms

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