# Teal color palette The Teal color palette brings together green and teal. The colors span a moderate lightness range, combining strong color with gentle contrast. Its balanced and composed character suits travel posters and environmental mood boards. Its darkest tone is teal, and its lightest tone is green. - Also called: Analogous teal to blue linear gradient - Seed: `kUvFB10DNB8I6QqzNsKg` - Page: https://grabient.com/kUvFB10DNB8I6QqzNsKg?steps=32 - Drawn as: linear gradient, 32 steps, 90 degrees - Kinds: light to dark, vivid, cool - Hues: analogous - 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 | `#5ec19a` | `oklch(74.02% 0.1102 165.23)` | Silver Tree | black, 9.5 to 1 | | 2 | `#59bf99` | `oklch(73.38% 0.1120 166.18)` | New Meadow | black, 9.3 to 1 | | 3 | `#52bd98` | `oklch(72.58% 0.1144 167.35)` | Expressionism Green | black, 9.1 to 1 | | 4 | `#48bb96` | `oklch(71.62% 0.1172 168.72)` | Expressionism Green | black, 8.8 to 1 | | 5 | `#3cb895` | `oklch(70.55% 0.1203 170.26)` | Aoife’s Green | black, 8.4 to 1 | | 6 | `#2db594` | `oklch(69.39% 0.1236 171.94)` | Aoife’s Green | black, 8.1 to 1 | | 7 | `#14b292` | `oklch(68.18% 0.1271 173.74)` | Victorian Greenhouse | black, 7.7 to 1 | | 8 | `#00ae92` | `oklch(66.94% 0.1255 175.62)` | Hobgoblin | black, 7.4 to 1 | | 9 | `#00a991` | `oklch(65.70% 0.1213 177.56)` | Shindig | black, 7 to 1 | | 10 | `#00a490` | `oklch(64.50% 0.1174 179.52)` | Fishy House | black, 6.7 to 1 | | 11 | `#00a08f` | `oklch(63.36% 0.1138 181.49)` | Turquish | black, 6.4 to 1 | | 12 | `#009c8e` | `oklch(62.28% 0.1106 183.46)` | Tropics | black, 6.1 to 1 | | 13 | `#00988d` | `oklch(61.23% 0.1076 185.53)` | Green Dynasty | black, 5.8 to 1 | | 14 | `#00948c` | `oklch(60.17% 0.1048 187.69)` | Torrid Turquoise | black, 5.6 to 1 | | 15 | `#00918b` | `oklch(59.12% 0.1021 189.92)` | Supermint | black, 5.3 to 1 | | 16 | `#008d8a` | `oklch(58.06% 0.0996 192.21)` | Corfu Shallows | black, 5.1 to 1 | | 17 | `#008989` | `oklch(57.00% 0.0973 194.54)` | Green Moblin | black, 4.9 to 1 | | 18 | `#008587` | `oklch(55.94% 0.0952 196.89)` | Bay Teal | black, 4.7 to 1 | | 19 | `#008186` | `oklch(54.87% 0.0933 199.24)` | Precious Blue | white, 4.6 to 1 | | 20 | `#007d84` | `oklch(53.79% 0.0915 201.58)` | Macquarie | white, 4.8 to 1 | | 21 | `#007a83` | `oklch(52.71% 0.0898 203.89)` | Mediterranean Cove | white, 5.1 to 1 | | 22 | `#007681` | `oklch(51.60% 0.0883 206.16)` | Hypnotic Sea | white, 5.3 to 1 | | 23 | `#00727f` | `oklch(50.40% 0.0868 208.57)` | Deep Current | white, 5.6 to 1 | | 24 | `#006d7c` | `oklch(49.13% 0.0853 211.11)` | Coastal Jetty | white, 6 to 1 | | 25 | `#00697a` | `oklch(47.80% 0.0839 213.73)` | Teal With It | white, 6.3 to 1 | | 26 | `#006477` | `oklch(46.47% 0.0827 216.35)` | Atlantis Myth | white, 6.7 to 1 | | 27 | `#006074` | `oklch(45.16% 0.0816 218.91)` | Ocean Radiance | white, 7.1 to 1 | | 28 | `#005c72` | `oklch(43.91% 0.0807 221.36)` | Octagon Ocean | white, 7.5 to 1 | | 29 | `#00586f` | `oklch(42.75% 0.0800 223.62)` | Subaqueous | white, 7.9 to 1 | | 30 | `#00556d` | `oklch(41.72% 0.0795 225.64)` | Blue Palisade | white, 8.3 to 1 | | 31 | `#00526b` | `oklch(40.84% 0.0791 227.35)` | Blue Palisade | white, 8.7 to 1 | | 32 | `#00506a` | `oklch(40.16% 0.0789 228.68)` | Hanada Blue | white, 8.9 to 1 | ## CSS ```css background: linear-gradient(90deg, #5ec19a 0.0%, #59bf99 3.2%, #52bd98 6.5%, #48bb96 9.7%, #3cb895 12.9%, #2db594 16.1%, #14b292 19.4%, #00ae92 22.6%, #00a991 25.8%, #00a490 29.0%, #00a08f 32.3%, #009c8e 35.5%, #00988d 38.7%, #00948c 41.9%, #00918b 45.2%, #008d8a 48.4%, #008989 51.6%, #008587 54.8%, #008186 58.1%, #007d84 61.3%, #007a83 64.5%, #007681 67.7%, #00727f 71.0%, #006d7c 74.2%, #00697a 77.4%, #006477 80.6%, #006074 83.9%, #005c72 87.1%, #00586f 90.3%, #00556d 93.5%, #00526b 96.8%, #00506a 100.0%); background: linear-gradient(90deg in oklch, oklch(74.02% 0.1102 165.23) 0.0%, oklch(73.38% 0.1120 166.18) 3.2%, oklch(72.58% 0.1144 167.35) 6.5%, oklch(71.62% 0.1172 168.72) 9.7%, oklch(70.55% 0.1203 170.26) 12.9%, oklch(69.39% 0.1236 171.94) 16.1%, oklch(68.18% 0.1271 173.74) 19.4%, oklch(66.94% 0.1255 175.62) 22.6%, oklch(65.70% 0.1213 177.56) 25.8%, oklch(64.50% 0.1174 179.52) 29.0%, oklch(63.36% 0.1138 181.49) 32.3%, oklch(62.28% 0.1106 183.46) 35.5%, oklch(61.23% 0.1076 185.53) 38.7%, oklch(60.17% 0.1048 187.69) 41.9%, oklch(59.12% 0.1021 189.92) 45.2%, oklch(58.06% 0.0996 192.21) 48.4%, oklch(57.00% 0.0973 194.54) 51.6%, oklch(55.94% 0.0952 196.89) 54.8%, oklch(54.87% 0.0933 199.24) 58.1%, oklch(53.79% 0.0915 201.58) 61.3%, oklch(52.71% 0.0898 203.89) 64.5%, oklch(51.60% 0.0883 206.16) 67.7%, oklch(50.40% 0.0868 208.57) 71.0%, oklch(49.13% 0.0853 211.11) 74.2%, oklch(47.80% 0.0839 213.73) 77.4%, oklch(46.47% 0.0827 216.35) 80.6%, oklch(45.16% 0.0816 218.91) 83.9%, oklch(43.91% 0.0807 221.36) 87.1%, oklch(42.75% 0.0800 223.62) 90.3%, oklch(41.72% 0.0795 225.64) 93.5%, oklch(40.84% 0.0791 227.35) 96.8%, oklch(40.16% 0.0789 228.68) 100.0%); ``` ## Keyframes 4 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees. | Keyframe | Lightness | Chroma | Hue | | --- | --- | --- | --- | | 1 | 0.74 | 0.11 | 165.2 | | 2 | 0.63 | 0.141 | 182.1 | | 3 | 0.52 | 0.16 | 205.4 | | 4 | 0.402 | 0.15 | 228.6 | ## In these collections - [Ocean gradients](https://grabient.com/ocean-gradients) - [Beach gradients](https://grabient.com/beach-gradients) - [Coastal gradients](https://grabient.com/coastal-gradients) ## Other forms - [JSON](https://grabient.com/kUvFB10DNB8I6QqzNsKg.json?steps=32) - [PNG](https://grabient.com/kUvFB10DNB8I6QqzNsKg.png?steps=32) - [SVG](https://grabient.com/kUvFB10DNB8I6QqzNsKg.svg?steps=32) - [CSS](https://grabient.com/kUvFB10DNB8I6QqzNsKg.css?steps=32) - [ASE](https://grabient.com/kUvFB10DNB8I6QqzNsKg.ase?steps=32) - [GPL](https://grabient.com/kUvFB10DNB8I6QqzNsKg.gpl?steps=32) - [GRD](https://grabient.com/kUvFB10DNB8I6QqzNsKg.grd?steps=32) - [Design tokens](https://grabient.com/kUvFB10DNB8I6QqzNsKg.tokens.json?steps=32) - [Social card](https://grabient.com/api/og?seed=kUvFB10DNB8I6QqzNsKg&steps=32) - [Palettes like this one](https://grabient.com/palettes?q=kUvFB10DNB8I6QqzNsKg) - [Guide for agents](https://grabient.com/llms.txt)