# Apricot Twilight Sunset Rings

These 5 concentric rings move outward through dusty apricot, deep brown, deep plum, pale periwinkle, and pale pink. The separated colors provide clear roles for backgrounds, headings, borders, icons, and small accents while preserving the collection's visual character.

- Also called: Tan, dark purple, light blue and pink radial swatches
- Seed: `kWtEcnKB0_R0ltdrGzobqJGA`
- Page: https://grabient.com/kWtEcnKB0_R0ltdrGzobqJGA?style=radialSwatches&steps=5&angle=0
- Drawn as: radial swatches, 5 steps, 0 degrees
- Kinds: dark center, vivid
- Hues: two-hue
- Contrast of its darkest and lightest colors: 11.4 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 | `#d19065` | `oklch(70.87% 0.0978 54.84)` | Whiskey | black, 7.9 to 1 |
| 2 | `#502303` | `oklch(31.50% 0.0799 49.56)` | Evil Cigar | white, 13.2 to 1 |
| 3 | `#320237` | `oklch(22.83% 0.1033 323.96)` | Exquisite Eggplant | white, 17.5 to 1 |
| 4 | `#bcc8fd` | `oklch(84.25% 0.0744 274.30)` | Light Periwinkle | black, 12.8 to 1 |
| 5 | `#f5bff6` | `oklch(87.01% 0.0937 326.08)` | Electric Lavender | black, 13.6 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #d19065 0.000% 20.000%, #502303 20.000% 40.000%, #320237 40.000% 60.000%, #bcc8fd 60.000% 80.000%, #f5bff6 80.000% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(70.87% 0.0978 54.84) 0.000% 20.000%, oklch(31.50% 0.0799 49.56) 20.000% 40.000%, oklch(22.83% 0.1033 323.96) 40.000% 60.000%, oklch(84.25% 0.0744 274.30) 60.000% 80.000%, oklch(87.01% 0.0937 326.08) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.709 | 0.098 | 54.8 |
| 2 | 0.315 | 0.08 | 49.6 |
| 3 | 0.228 | 0.103 | -36 |
| 4 | 0.843 | 0.074 | -85.7 |
| 5 | 0.87 | 0.094 | -33.9 |

## In these collections

- [Sunset swatches](https://grabient.com/sunset-swatches)

## Other forms

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