# Forest Teal Marble Fan

These angular wedges move from forest green through deep teal, muted slate, and pale blue gray. The compact fan balances mineral coolness with an earthy opening note, giving it a carved stone quality. Use them for marble inspired graphics, sophisticated data displays, architectural presentations, or calm brand systems with a natural edge.

- Also called: Dark green, teal and gray angular swatches
- Seed: `kUXR1dvRxJsuFu_jh0zg`
- Page: https://grabient.com/kUXR1dvRxJsuFu_jh0zg?style=angularSwatches&steps=4&angle=210
- Drawn as: angular swatches, 4 steps, 210 degrees
- Kinds: dark to light, muted, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 5.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 | `#37432d` | `oklch(36.61% 0.0400 131.48)` | Deep Seaweed | white, 10.4 to 1 |
| 2 | `#176978` | `oklch(48.03% 0.0772 213.91)` | Jester Blue | white, 6.3 to 1 |
| 3 | `#75827f` | `oklch(59.45% 0.0152 180.09)` | Adrift at Sea | black, 5.2 to 1 |
| 4 | `#b8b7c4` | `oklch(78.35% 0.0193 290.00)` | Silverware | black, 10.5 to 1 |

## CSS

```css
background: conic-gradient(from 210deg, #37432d 0.000% 25.000%, #176978 25.000% 50.000%, #75827f 50.000% 75.000%, #b8b7c4 75.000% 100.000%);
background: conic-gradient(from 210deg, oklch(36.61% 0.0400 131.48) 0.000% 25.000%, oklch(48.03% 0.0772 213.91) 25.000% 50.000%, oklch(59.45% 0.0152 180.09) 50.000% 75.000%, oklch(78.35% 0.0193 290.00) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.366 | 0.04 | 131.5 |
| 2 | 0.48 | 0.077 | 213.9 |
| 3 | 0.594 | 0.015 | 180.1 |
| 4 | 0.783 | 0.019 | 290 |

## In these collections

- [Marble swatches](https://grabient.com/marble-swatches)

## Other forms

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