# Blue and Green: Pale blue and teal

The "Blue and Green: Pale blue and teal" palette brings together pale blue, teal, and green. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is green, and its lightest tone is pale blue.

- Also called: Cool light blue, teal and dark green linear gradient
- Seed: `kW6SWg5SW-9YpP1HJTvsBm-Q`
- Page: https://grabient.com/kW6SWg5SW-9YpP1HJTvsBm-Q?steps=32&angle=315
- Drawn as: linear gradient, 32 steps, 315 degrees
- Kinds: light to dark, vivid, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 7.7 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 | `#c1ecfe` | `oklch(91.73% 0.0510 225.70)` | Blue Java Banana | black, 16.6 to 1 |
| 2 | `#bae9fd` | `oklch(90.75% 0.0555 225.00)` | Blue Java Banana | black, 16.1 to 1 |
| 3 | `#b0e6fb` | `oklch(89.44% 0.0618 224.04)` | Frozen Landscape | black, 15.5 to 1 |
| 4 | `#a5e2f9` | `oklch(87.88% 0.0694 222.90)` | Ganon Blue | black, 14.8 to 1 |
| 5 | `#98def6` | `oklch(86.15% 0.0776 221.65)` | Columbia Blue | black, 14 to 1 |
| 6 | `#89d9f3` | `oklch(84.32% 0.0858 220.36)` | Photon Barrier | black, 13.2 to 1 |
| 7 | `#7bd4ef` | `oklch(82.50% 0.0934 219.11)` | Middle Blue | black, 12.5 to 1 |
| 8 | `#6ed0eb` | `oklch(80.74% 0.0997 217.98)` | Summer Splash | black, 11.8 to 1 |
| 9 | `#62cce7` | `oklch(79.14% 0.1043 217.05)` | Hawaiian Breeze | black, 11.2 to 1 |
| 10 | `#58c7e2` | `oklch(77.60% 0.1076 216.53)` | Naxos Sky | black, 10.6 to 1 |
| 11 | `#4ec2de` | `oklch(76.07% 0.1099 216.34)` | Naxos Sky | black, 10.1 to 1 |
| 12 | `#46beda` | `oklch(74.55% 0.1115 216.27)` | Bachelor Button | black, 9.6 to 1 |
| 13 | `#3eb9d5` | `oklch(73.03% 0.1124 216.11)` | Bachelor Button | black, 9.1 to 1 |
| 14 | `#36b4d0` | `oklch(71.51% 0.1129 215.67)` | Ocean Sigh | black, 8.6 to 1 |
| 15 | `#2db0ca` | `oklch(70.00% 0.1131 214.74)` | Aquarius | black, 8.1 to 1 |
| 16 | `#23abc3` | `oklch(68.48% 0.1130 213.11)` | Sarah’s Garden | black, 7.7 to 1 |
| 17 | `#15a7bc` | `oklch(66.97% 0.1129 210.55)` | Jamaican Sea | black, 7.3 to 1 |
| 18 | `#00a3b3` | `oklch(65.53% 0.1123 206.92)` | Garish Blue | black, 6.9 to 1 |
| 19 | `#00a0a9` | `oklch(64.13% 0.1092 202.46)` | Ducati | black, 6.5 to 1 |
| 20 | `#009c9f` | `oklch(62.74% 0.1067 197.51)` | Riviera Paradise | black, 6.2 to 1 |
| 21 | `#009895` | `oklch(61.31% 0.1052 192.37)` | Columbia | black, 5.8 to 1 |
| 22 | `#00938a` | `oklch(59.80% 0.1043 187.35)` | Torrid Turquoise | black, 5.5 to 1 |
| 23 | `#008e80` | `oklch(58.17% 0.1037 182.77)` | Philips Green | black, 5.2 to 1 |
| 24 | `#028977` | `oklch(56.38% 0.1026 178.95)` | Emerald Enchantment | black, 4.8 to 1 |
| 25 | `#0a826d` | `oklch(54.32% 0.0996 175.97)` | Emperor’s Silk | white, 4.7 to 1 |
| 26 | `#0f7a64` | `oklch(51.88% 0.0956 173.42)` | Ultramarine Green | white, 5.2 to 1 |
| 27 | `#12715a` | `oklch(49.21% 0.0910 171.23)` | Tropical Rainforest | white, 5.9 to 1 |
| 28 | `#136851` | `oklch(46.45% 0.0861 169.38)` | Tractor Green | white, 6.6 to 1 |
| 29 | `#146049` | `oklch(43.78% 0.0812 167.81)` | Sci-Fi Takeout | white, 7.5 to 1 |
| 30 | `#135842` | `oklch(41.34% 0.0767 166.48)` | Billiard Table | white, 8.3 to 1 |
| 31 | `#13523c` | `oklch(39.29% 0.0730 165.37)` | Trapper Green | white, 9.1 to 1 |
| 32 | `#134d38` | `oklch(37.80% 0.0703 164.41)` | County Green | white, 9.7 to 1 |

## CSS

```css
background: linear-gradient(315deg, #c1ecfe 0.0%, #bae9fd 3.2%, #b0e6fb 6.5%, #a5e2f9 9.7%, #98def6 12.9%, #89d9f3 16.1%, #7bd4ef 19.4%, #6ed0eb 22.6%, #62cce7 25.8%, #58c7e2 29.0%, #4ec2de 32.3%, #46beda 35.5%, #3eb9d5 38.7%, #36b4d0 41.9%, #2db0ca 45.2%, #23abc3 48.4%, #15a7bc 51.6%, #00a3b3 54.8%, #00a0a9 58.1%, #009c9f 61.3%, #009895 64.5%, #00938a 67.7%, #008e80 71.0%, #028977 74.2%, #0a826d 77.4%, #0f7a64 80.6%, #12715a 83.9%, #136851 87.1%, #146049 90.3%, #135842 93.5%, #13523c 96.8%, #134d38 100.0%);
background: linear-gradient(315deg in oklch, oklch(91.73% 0.0510 225.70) 0.0%, oklch(90.75% 0.0555 225.00) 3.2%, oklch(89.44% 0.0618 224.04) 6.5%, oklch(87.88% 0.0694 222.90) 9.7%, oklch(86.15% 0.0776 221.65) 12.9%, oklch(84.32% 0.0858 220.36) 16.1%, oklch(82.50% 0.0934 219.11) 19.4%, oklch(80.74% 0.0997 217.98) 22.6%, oklch(79.14% 0.1043 217.05) 25.8%, oklch(77.60% 0.1076 216.53) 29.0%, oklch(76.07% 0.1099 216.34) 32.3%, oklch(74.55% 0.1115 216.27) 35.5%, oklch(73.03% 0.1124 216.11) 38.7%, oklch(71.51% 0.1129 215.67) 41.9%, oklch(70.00% 0.1131 214.74) 45.2%, oklch(68.48% 0.1130 213.11) 48.4%, oklch(66.97% 0.1129 210.55) 51.6%, oklch(65.53% 0.1123 206.92) 54.8%, oklch(64.13% 0.1092 202.46) 58.1%, oklch(62.74% 0.1067 197.51) 61.3%, oklch(61.31% 0.1052 192.37) 64.5%, oklch(59.80% 0.1043 187.35) 67.7%, oklch(58.17% 0.1037 182.77) 71.0%, oklch(56.38% 0.1026 178.95) 74.2%, oklch(54.32% 0.0996 175.97) 77.4%, oklch(51.88% 0.0956 173.42) 80.6%, oklch(49.21% 0.0910 171.23) 83.9%, oklch(46.45% 0.0861 169.38) 87.1%, oklch(43.78% 0.0812 167.81) 90.3%, oklch(41.34% 0.0767 166.48) 93.5%, oklch(39.29% 0.0730 165.37) 96.8%, oklch(37.80% 0.0703 164.41) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.917 | 0.051 | 225.7 |
| 2 | 0.795 | 0.103 | 217.2 |
| 3 | 0.677 | 0.113 | 212 |
| 4 | 0.559 | 0.102 | 178.1 |
| 5 | 0.378 | 0.07 | 164.4 |

## In these collections

- [Blue and green gradients](https://grabient.com/blue-and-green-gradients)

## Other forms

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