# Indigo celadon and rust textile rings

Ink navy expands through indigo and muted denim blue into teal, pale celadon and warm cream. Ochre, tan and rust finish the outside of the palette. Twenty-four radial swatches combine cool indigo-dye colors with warmer cloth-inspired tones, creating a subdued yukata palette whose concentric bands make each stage of the transition distinct.

- Also called: Navy, teal, tan and brown radial swatches
- Seed: `kWPCe3L52_UKavvsEa1vCI54`
- Page: https://grabient.com/kWPCe3L52_UKavvsEa1vCI54?style=radialSwatches&steps=24&angle=0
- Drawn as: radial swatches, 24 steps, 0 degrees
- Kinds: light center
- Hues: complementary
- Contrast of its darkest and lightest colors: 10.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 | `#0d1e37` | `oklch(23.62% 0.0537 257.34)` | Trapped Darkness | white, 16.6 to 1 |
| 2 | `#0e223d` | `oklch(25.19% 0.0573 256.78)` | Cool Balaclavas Are Forever | white, 15.9 to 1 |
| 3 | `#112745` | `oklch(27.35% 0.0627 256.02)` | Dark Eclipse | white, 14.9 to 1 |
| 4 | `#132e4f` | `oklch(29.91% 0.0688 255.11)` | Midnight Ocean | white, 13.7 to 1 |
| 5 | `#16355a` | `oklch(32.68% 0.0747 254.07)` | Incremental Blue | white, 12.3 to 1 |
| 6 | `#1a3d64` | `oklch(35.44% 0.0793 252.94)` | Blue Opal | white, 11.1 to 1 |
| 7 | `#1e446c` | `oklch(38.01% 0.0817 251.89)` | Fish Net Blue | white, 9.9 to 1 |
| 8 | `#254a73` | `oklch(40.25% 0.0822 253.17)` | Sapphire Earrings | white, 9.1 to 1 |
| 9 | `#2e4f7a` | `oklch(42.34% 0.0814 255.88)` | High Altar | white, 8.3 to 1 |
| 10 | `#375580` | `oklch(44.56% 0.0797 257.73)` | Overtake | white, 7.6 to 1 |
| 11 | `#3e5c86` | `oklch(47.17% 0.0773 256.43)` | Delft | white, 6.7 to 1 |
| 12 | `#42688d` | `oklch(50.42% 0.0745 249.71)` | Snake River | white, 5.8 to 1 |
| 13 | `#457895` | `oklch(54.80% 0.0712 235.00)` | Cry Me a River | white, 4.8 to 1 |
| 14 | `#528f9b` | `oklch(61.40% 0.0660 210.69)` | Adrift | black, 5.7 to 1 |
| 15 | `#72a89d` | `oklch(69.10% 0.0596 180.24)` | Twining Vine | black, 7.8 to 1 |
| 16 | `#9dbda0` | `oklch(76.54% 0.0536 147.64)` | Spring Rain | black, 10.1 to 1 |
| 17 | `#c2caa6` | `oklch(82.30% 0.0492 116.91)` | Jardin de Hierbas | black, 12.2 to 1 |
| 18 | `#d9cdab` | `oklch(85.00% 0.0479 92.04)` | Gabriel’s Light | black, 13.3 to 1 |
| 19 | `#dcc4a4` | `oklch(83.31% 0.0510 75.00)` | Louvre | black, 12.5 to 1 |
| 20 | `#d2ae90` | `oklch(77.51% 0.0584 62.35)` | Fossil Tan | black, 10.1 to 1 |
| 21 | `#bf9175` | `oklch(69.30% 0.0681 53.04)` | Charleston Chocolate | black, 7.5 to 1 |
| 22 | `#a97259` | `oklch(60.37% 0.0785 46.20)` | Hazelnut | black, 5.2 to 1 |
| 23 | `#955842` | `oklch(52.45% 0.0876 40.97)` | Seville Scarlet | white, 5.6 to 1 |
| 24 | `#884734` | `oklch(47.24% 0.0937 36.48)` | Burning Brier | white, 7 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #0d1e37 0.000% 4.167%, #0e223d 4.167% 8.333%, #112745 8.333% 12.500%, #132e4f 12.500% 16.667%, #16355a 16.667% 20.833%, #1a3d64 20.833% 25.000%, #1e446c 25.000% 29.167%, #254a73 29.167% 33.333%, #2e4f7a 33.333% 37.500%, #375580 37.500% 41.667%, #3e5c86 41.667% 45.833%, #42688d 45.833% 50.000%, #457895 50.000% 54.167%, #528f9b 54.167% 58.333%, #72a89d 58.333% 62.500%, #9dbda0 62.500% 66.667%, #c2caa6 66.667% 70.833%, #d9cdab 70.833% 75.000%, #dcc4a4 75.000% 79.167%, #d2ae90 79.167% 83.333%, #bf9175 83.333% 87.500%, #a97259 87.500% 91.667%, #955842 91.667% 95.833%, #884734 95.833% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(23.62% 0.0537 257.34) 0.000% 4.167%, oklch(25.19% 0.0573 256.78) 4.167% 8.333%, oklch(27.35% 0.0627 256.02) 8.333% 12.500%, oklch(29.91% 0.0688 255.11) 12.500% 16.667%, oklch(32.68% 0.0747 254.07) 16.667% 20.833%, oklch(35.44% 0.0793 252.94) 20.833% 25.000%, oklch(38.01% 0.0817 251.89) 25.000% 29.167%, oklch(40.25% 0.0822 253.17) 29.167% 33.333%, oklch(42.34% 0.0814 255.88) 33.333% 37.500%, oklch(44.56% 0.0797 257.73) 37.500% 41.667%, oklch(47.17% 0.0773 256.43) 41.667% 45.833%, oklch(50.42% 0.0745 249.71) 45.833% 50.000%, oklch(54.80% 0.0712 235.00) 50.000% 54.167%, oklch(61.40% 0.0660 210.69) 54.167% 58.333%, oklch(69.10% 0.0596 180.24) 58.333% 62.500%, oklch(76.54% 0.0536 147.64) 62.500% 66.667%, oklch(82.30% 0.0492 116.91) 66.667% 70.833%, oklch(85.00% 0.0479 92.04) 70.833% 75.000%, oklch(83.31% 0.0510 75.00) 75.000% 79.167%, oklch(77.51% 0.0584 62.35) 79.167% 83.333%, oklch(69.30% 0.0681 53.04) 83.333% 87.500%, oklch(60.37% 0.0785 46.20) 87.500% 91.667%, oklch(52.45% 0.0876 40.97) 91.667% 95.833%, oklch(47.24% 0.0937 36.48) 95.833% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.236 | 0.054 | 257.3 |
| 2 | 0.374 | 0.081 | 252.1 |
| 3 | 0.524 | 0.073 | 243.6 |
| 4 | 0.85 | 0.048 | 87.2 |
| 5 | 0.472 | 0.094 | 36.5 |

## In these collections

- [Indigo yukata](https://grabient.com/indigo-yukata)

## Other forms

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