# Ember Orange Bands

Five discrete bands move through red #6b2f21, red #e28a54, red #e96d1a, orange #f7c27b, and red #8b341a. The five fixed bands provide warm roles for food packaging, seasonal graphics, or charts that need orange variation with reliable dark and pale anchors. The stated order preserves the native composition.

- Also called: Analogous brown, orange and tan radial swatches
- Seed: `kWYkEZWy7B1W_v5rp0LuK07o`
- Page: https://grabient.com/kWYkEZWy7B1W_v5rp0LuK07o?style=radialSwatches&steps=5&angle=0
- Drawn as: radial swatches, 5 steps, 0 degrees
- Kinds: light center, vivid, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 6.2 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 | `#6b2f21` | `oklch(38.58% 0.0896 35.16)` | Hereford Cow Brown | white, 10.1 to 1 |
| 2 | `#e28a54` | `oklch(71.65% 0.1281 51.01)` | Aegean Sky | black, 8 to 1 |
| 3 | `#e96d1a` | `oklch(67.32% 0.1750 47.84)` | Epicurean Orange | black, 6.6 to 1 |
| 4 | `#f7c27b` | `oklch(84.65% 0.1075 73.20)` | Zing | black, 12.9 to 1 |
| 5 | `#8b341a` | `oklch(44.49% 0.1240 37.27)` | Rogan Josh | white, 8 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #6b2f21 0.000% 20.000%, #e28a54 20.000% 40.000%, #e96d1a 40.000% 60.000%, #f7c27b 60.000% 80.000%, #8b341a 80.000% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(38.58% 0.0896 35.16) 0.000% 20.000%, oklch(71.65% 0.1281 51.01) 20.000% 40.000%, oklch(67.32% 0.1750 47.84) 40.000% 60.000%, oklch(84.65% 0.1075 73.20) 60.000% 80.000%, oklch(44.49% 0.1240 37.27) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.386 | 0.09 | 35.2 |
| 2 | 0.717 | 0.128 | 51 |
| 3 | 0.673 | 0.175 | 47.8 |
| 4 | 0.846 | 0.107 | 73.2 |
| 5 | 0.445 | 0.124 | 37.3 |

## In these collections

- [Orange swatches](https://grabient.com/orange-swatches)

## Other forms

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