# Orange, emerald and champagne funhaus palette

The Orange, emerald and champagne funhaus palette brings together orange, yellow, teal, and pale orange. The colors span a moderate lightness range, combining strong color with clear contrast. Its light and open character suits brand mood boards and editorial graphics. Its darkest tone is teal, and its lightest tone is pale orange.

- Also called: Orange, yellow, teal and beige angular swatches
- Seed: `kUp40bcLnG8Sdyv3DjMg`
- Page: https://grabient.com/kUp40bcLnG8Sdyv3DjMg?style=angularSwatches&steps=4&angle=135
- Drawn as: angular swatches, 4 steps, 135 degrees
- Kinds: vivid
- Hues: wide
- Contrast of its darkest and lightest colors: 4 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 | `#ef5a26` | `oklch(65.75% 0.1943 37.97)` | Buffallo Sauce | black, 6.1 to 1 |
| 2 | `#f7d94a` | `oklch(88.58% 0.1585 97.15)` | Gilded | black, 14.9 to 1 |
| 3 | `#257d79` | `oklch(53.94% 0.0813 190.14)` | Zirconia Teal | white, 4.8 to 1 |
| 4 | `#f7e8ce` | `oklch(93.70% 0.0386 82.35)` | Night Light | black, 17.4 to 1 |

## CSS

```css
background: conic-gradient(from 135deg, #ef5a26 0.000% 25.000%, #f7d94a 25.000% 50.000%, #257d79 50.000% 75.000%, #f7e8ce 75.000% 100.000%);
background: conic-gradient(from 135deg, oklch(65.75% 0.1943 37.97) 0.000% 25.000%, oklch(88.58% 0.1585 97.15) 25.000% 50.000%, oklch(53.94% 0.0813 190.14) 50.000% 75.000%, oklch(93.70% 0.0386 82.35) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.657 | 0.194 | 38 |
| 2 | 0.886 | 0.158 | 97.1 |
| 3 | 0.539 | 0.081 | 190.1 |
| 4 | 0.937 | 0.039 | 82.4 |

## In these collections

- [Funhaus](https://grabient.com/funhaus)

## Other forms

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