# Seafoam Abyss Rings

These six concentric rings move outward through muted sage, deep sea green, near-black green, pale sage, bright seafoam, and near-black green. Alternating light and dark rings make a strong focal structure and give type, icons, or simple marks several contrasting placements. It suits ocean-themed posters, packaging, album artwork, or graphic backgrounds inspired by kelp, foam, and deep water.

- Also called: Analogous green, black and light blue radial swatches
- Seed: `kYizJzsZzAI-IQdnFT5diPBQ-KPg`
- Page: https://grabient.com/kYizJzsZzAI-IQdnFT5diPBQ-KPg?style=radialSwatches&steps=6&angle=0
- Drawn as: radial swatches, 6 steps, 0 degrees
- Kinds: vivid, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 17 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 | `#497e65` | `oklch(54.72% 0.0689 162.42)` | Sports Field Green | white, 4.7 to 1 |
| 2 | `#09523a` | `oklch(38.98% 0.0785 164.54)` | Trapper Green | white, 9.2 to 1 |
| 3 | `#000806` | `oklch(12.20% 0.0220 180.39)` | Black Metal | white, 20.2 to 1 |
| 4 | `#9eceb9` | `oklch(81.10% 0.0579 166.65)` | Thermal Aqua | black, 11.9 to 1 |
| 5 | `#9cfee8` | `oklch(92.91% 0.0978 178.27)` | Hello Winter | black, 17.6 to 1 |
| 6 | `#000904` | `oklch(12.24% 0.0270 161.74)` | Melanous | white, 20.1 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #497e65 0.000% 16.667%, #09523a 16.667% 33.333%, #000806 33.333% 50.000%, #9eceb9 50.000% 66.667%, #9cfee8 66.667% 83.333%, #000904 83.333% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(54.72% 0.0689 162.42) 0.000% 16.667%, oklch(38.98% 0.0785 164.54) 16.667% 33.333%, oklch(12.20% 0.0220 180.39) 33.333% 50.000%, oklch(81.10% 0.0579 166.65) 50.000% 66.667%, oklch(92.91% 0.0978 178.27) 66.667% 83.333%, oklch(12.24% 0.0270 161.74) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.547 | 0.069 | 162.4 |
| 2 | 0.39 | 0.079 | 164.5 |
| 3 | 0.122 | 0.022 | 180.4 |
| 4 | 0.811 | 0.058 | 166.6 |
| 5 | 0.929 | 0.098 | 178.3 |
| 6 | 0.122 | 0.028 | 162.4 |

## In these collections

- [Ocean swatches](https://grabient.com/ocean-swatches)

## Other forms

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