# Emerald, violet and rose color palette

The Emerald, violet and rose color palette brings together green, blue, purple, and magenta. The colors span a narrow lightness range, combining strong color with gentle contrast. Its balanced and composed character suits game interface concepts and stream graphics. Its darkest tone is purple, and its lightest tone is green.

- Also called: Neon green, blue, purple and pink linear swatches
- Seed: `kcr6hmWLRCVCvyJGWEORWZC89uwpVbEI0-BCQ`
- Page: https://grabient.com/kcr6hmWLRCVCvyJGWEORWZC89uwpVbEI0-BCQ?style=linearSwatches&steps=8&angle=45
- Drawn as: linear swatches, 8 steps, 45 degrees
- Kinds: vivid, neon, multicolor
- Hues: two-hue
- Contrast of its darkest and lightest colors: 2.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 | `#00bc1e` | `oklch(68.90% 0.2274 143.43)` | Pedestrian Green | black, 8.1 to 1 |
| 2 | `#1eb984` | `oklch(69.69% 0.1433 163.52)` | Slime Girl | black, 8.2 to 1 |
| 3 | `#1a95cf` | `oklch(63.39% 0.1309 236.43)` | Astrolabe Reef | black, 6.2 to 1 |
| 4 | `#355bfc` | `oklch(55.12% 0.2425 267.08)` | YInMn Blue | white, 5.1 to 1 |
| 5 | `#7f25ff` | `oklch(54.33% 0.2800 292.44)` | Szöllősi Grape | white, 5.8 to 1 |
| 6 | `#c611ff` | `oklch(62.20% 0.3013 314.63)` | Sparkling Purple | black, 4.9 to 1 |
| 7 | `#f507de` | `oklch(66.93% 0.2976 333.65)` | Vice City | black, 5.9 to 1 |
| 8 | `#fe159d` | `oklch(65.75% 0.2646 353.73)` | Forgiven Sin | black, 5.8 to 1 |

## CSS

```css
background: linear-gradient(45deg, #00bc1e 0.000% 12.500%, #1eb984 12.500% 25.000%, #1a95cf 25.000% 37.500%, #355bfc 37.500% 50.000%, #7f25ff 50.000% 62.500%, #c611ff 62.500% 75.000%, #f507de 75.000% 87.500%, #fe159d 87.500% 100.000%);
background: linear-gradient(45deg, oklch(68.90% 0.2274 143.43) 0.000% 12.500%, oklch(69.69% 0.1433 163.52) 12.500% 25.000%, oklch(63.39% 0.1309 236.43) 25.000% 37.500%, oklch(55.12% 0.2425 267.08) 37.500% 50.000%, oklch(54.33% 0.2800 292.44) 50.000% 62.500%, oklch(62.20% 0.3013 314.63) 62.500% 75.000%, oklch(66.93% 0.2976 333.65) 75.000% 87.500%, oklch(65.75% 0.2646 353.73) 87.500% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.689 | 0.231 | 143.4 |
| 2 | 0.697 | 0.143 | 163.5 |
| 3 | 0.634 | 0.131 | 236.4 |
| 4 | 0.551 | 0.243 | 267.1 |
| 5 | 0.543 | 0.281 | 292.4 |
| 6 | 0.622 | 0.305 | 314.6 |
| 7 | 0.669 | 0.298 | 333.7 |
| 8 | 0.657 | 0.265 | 353.7 |

## In these collections

- [Vivid multicolor gradients](https://grabient.com/vivid-multicolor-gradients)
- [Neon gradients](https://grabient.com/neon-gradients)

## Other forms

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