# Mint Jukebox Rings

Five bands move from olive through warm orange, deep teal, deep indigo, and finish in coral red. The separated colors give headings, backgrounds, borders, and small accents clearly defined roles. This balance works well in retro posters, album covers, packaging, and nostalgic interface accents, especially where readable contrast matters.

- Also called: Rainbow from gray to red radial swatches
- Seed: `kW1CJc0be2EWeUM9ns7QTTHg`
- Page: https://grabient.com/kW1CJc0be2EWeUM9ns7QTTHg?style=radialSwatches&steps=5&angle=0
- Drawn as: radial swatches, 5 steps, 0 degrees
- Kinds: light to dark, rainbow
- Hues: two-hue
- Contrast of its darkest and lightest colors: 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 | `#bfcfb0` | `oklch(83.46% 0.0469 130.08)` | Apple Ice | black, 12.8 to 1 |
| 2 | `#d56a2e` | `oklch(64.17% 0.1530 46.59)` | Gold Drop | black, 5.9 to 1 |
| 3 | `#26807b` | `oklch(54.72% 0.0827 189.26)` | Geneva Green | white, 4.7 to 1 |
| 4 | `#71507f` | `oklch(48.43% 0.0841 315.01)` | Patrician Purple | white, 6.6 to 1 |
| 5 | `#aa3b44` | `oklch(51.18% 0.1447 19.47)` | Frosted Pomegranate | white, 6.1 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #bfcfb0 0.000% 20.000%, #d56a2e 20.000% 40.000%, #26807b 40.000% 60.000%, #71507f 60.000% 80.000%, #aa3b44 80.000% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(83.46% 0.0469 130.08) 0.000% 20.000%, oklch(64.17% 0.1530 46.59) 20.000% 40.000%, oklch(54.72% 0.0827 189.26) 40.000% 60.000%, oklch(48.43% 0.0841 315.01) 60.000% 80.000%, oklch(51.18% 0.1447 19.47) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.835 | 0.047 | 130.1 |
| 2 | 0.642 | 0.153 | 46.6 |
| 3 | 0.547 | 0.083 | 189.3 |
| 4 | 0.484 | 0.084 | 315 |
| 5 | 0.512 | 0.145 | 379.5 |

## In these collections

- [Retro swatches](https://grabient.com/retro-swatches)

## Other forms

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