# Champagne, bronze and near-black practical magic palette

The Champagne, bronze and near-black practical magic palette brings together pale orange, green, red, and dark gray. The colors span a very broad lightness range, combining moderate color with high contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is dark gray, and its lightest tone is pale orange.

- Also called: Beige, green, maroon and black radial swatches
- Seed: `kU6xw-z5jEbgsMgcAj5g`
- Page: https://grabient.com/kU6xw-z5jEbgsMgcAj5g?style=radialSwatches&steps=4&angle=0
- Drawn as: radial swatches, 4 steps, 0 degrees
- Kinds: light to dark, muted, warm
- Hues: wide
- Contrast of its darkest and lightest colors: 13.8 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 | `#f1e5ca` | `oklch(92.52% 0.0386 87.89)` | Putting Bench | black, 16.8 to 1 |
| 2 | `#7e9063` | `oklch(62.60% 0.0675 125.93)` | Green Energy | black, 6 to 1 |
| 3 | `#882f45` | `oklch(44.09% 0.1213 8.63)` | Tibetan Red | white, 8.2 to 1 |
| 4 | `#1d1a1b` | `oklch(22.05% 0.0055 355.95)` | Siyâh Black | white, 17.3 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #f1e5ca 0.000% 25.000%, #7e9063 25.000% 50.000%, #882f45 50.000% 75.000%, #1d1a1b 75.000% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(92.52% 0.0386 87.89) 0.000% 25.000%, oklch(62.60% 0.0675 125.93) 25.000% 50.000%, oklch(44.09% 0.1213 8.63) 50.000% 75.000%, oklch(22.05% 0.0055 355.95) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.925 | 0.039 | 87.9 |
| 2 | 0.626 | 0.068 | 125.9 |
| 3 | 0.441 | 0.121 | 8.6 |
| 4 | 0.22 | 0.006 | -4 |

## In these collections

- [Practical Magic swatches](https://grabient.com/practical-magic-swatches)

## Other forms

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