# Forest green, near-black and indigo street fighter

The Forest green, near-black and indigo street fighter brings together green, orange, black, off-white, and blue. The colors span a very broad lightness range, combining strong color with high contrast. Its bold and dramatic character suits botanical branding and garden event graphics. Its darkest tone is black, and its lightest tone is off-white.

- Also called: Green, black, gray and blue linear swatches
- Seed: `kWephoVFA0gyDuj6A7outq6I`
- Page: https://grabient.com/kWephoVFA0gyDuj6A7outq6I?style=linearSwatches&steps=5
- Drawn as: linear swatches, 5 steps, 90 degrees
- Kinds: dark center, vivid
- Hues: two-hue
- Contrast of its darkest and lightest colors: 18.3 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 | `#007223` | `oklch(48.04% 0.1458 146.23)` | Clear Green | white, 6.1 to 1 |
| 2 | `#e36b00` | `oklch(66.14% 0.1747 50.06)` | Accent Orange | black, 6.3 to 1 |
| 3 | `#050203` | `oklch(9.84% 0.0096 1.48)` | Raven’s Coat | white, 20.6 to 1 |
| 4 | `#f4f0f7` | `oklch(96.06% 0.0096 312.86)` | Alpine Goat | black, 18.6 to 1 |
| 5 | `#093be0` | `oklch(46.06% 0.2494 264.25)` | Merchant Marine Blue | white, 7.7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #007223 0.000% 20.000%, #e36b00 20.000% 40.000%, #050203 40.000% 60.000%, #f4f0f7 60.000% 80.000%, #093be0 80.000% 100.000%);
background: linear-gradient(90deg, oklch(48.04% 0.1458 146.23) 0.000% 20.000%, oklch(66.14% 0.1747 50.06) 20.000% 40.000%, oklch(9.84% 0.0096 1.48) 40.000% 60.000%, oklch(96.06% 0.0096 312.86) 60.000% 80.000%, oklch(46.06% 0.2494 264.25) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.48 | 0.209 | 146.3 |
| 2 | 0.661 | 0.22 | 50.1 |
| 3 | 0.098 | 0.01 | 1.5 |
| 4 | 0.961 | 0.01 | -47.1 |
| 5 | 0.461 | 0.249 | -95.7 |

## In these collections

- [Street Fighter swatches](https://grabient.com/street-fighter-swatches)

## Other forms

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