# Mauve, turquoise and emerald iridescent glass interface

The Mauve, turquoise and emerald iridescent glass interface brings together magenta, purple, blue, teal, and green. The colors span a narrow lightness range, combining strong color with gentle contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is purple, and its lightest tone is green.

- Also called: Purple, blue, teal and green angular swatches
- Seed: `kYkUH7Q7S5kotu_WozZ3b47lgsv0`
- Page: https://grabient.com/kYkUH7Q7S5kotu_WozZ3b47lgsv0?style=angularSwatches&steps=6&angle=315
- Drawn as: angular swatches, 6 steps, 315 degrees
- Kinds: multicolor
- Hues: split-complementary
- Contrast of its darkest and lightest colors: 2.5 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 | `#a0617c` | `oklch(57.09% 0.0896 352.97)` | Beryl Red | white, 4.6 to 1 |
| 2 | `#7955b3` | `oklch(53.15% 0.1447 299.07)` | Royal Lavender | white, 5.5 to 1 |
| 3 | `#5778c5` | `oklch(58.27% 0.1254 265.26)` | Indigo Light | black, 4.8 to 1 |
| 4 | `#45aca0` | `oklch(68.11% 0.0965 184.95)` | Ambrosial Oceanside | black, 7.6 to 1 |
| 5 | `#4ec668` | `oklch(73.62% 0.1709 147.96)` | Zombie Green | black, 9.5 to 1 |
| 6 | `#6daf68` | `oklch(69.29% 0.1226 142.68)` | Ferntastic | black, 8 to 1 |

## CSS

```css
background: conic-gradient(from 315deg, #a0617c 0.000% 16.667%, #7955b3 16.667% 33.333%, #5778c5 33.333% 50.000%, #45aca0 50.000% 66.667%, #4ec668 66.667% 83.333%, #6daf68 83.333% 100.000%);
background: conic-gradient(from 315deg, oklch(57.09% 0.0896 352.97) 0.000% 16.667%, oklch(53.15% 0.1447 299.07) 16.667% 33.333%, oklch(58.27% 0.1254 265.26) 33.333% 50.000%, oklch(68.11% 0.0965 184.95) 50.000% 66.667%, oklch(73.62% 0.1709 147.96) 66.667% 83.333%, oklch(69.29% 0.1226 142.68) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.571 | 0.09 | 353 |
| 2 | 0.531 | 0.145 | 299.1 |
| 3 | 0.583 | 0.125 | 265.3 |
| 4 | 0.681 | 0.096 | 184.9 |
| 5 | 0.736 | 0.171 | 148 |
| 6 | 0.693 | 0.123 | 142.7 |

## In these collections

- [Iridescent glass interface](https://grabient.com/iridescent-glass-interface)

## Other forms

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