# Three color gradients

Three-color gradients shift from deep navy, brown, indigo, and plum through bright cyan, mint, blue, pink, amber, orange, and yellow to pale cream.

- Page: https://grabient.com/three-color-gradients
- Palettes: 6
- Tags: three color, gradients, blue, green, pink, purple, orange, colorful
- Collected by: Grabient
- Updated: 2026-10-08

## Palettes

1. [Cyan mint yellow gradient](https://grabient.com/kWvF2Y46082ozvTvLTv9Dc8A?steps=32&angle=45): linear gradient, `#13bfdc` `#12c0db` `#14c3d9` `#18c5d6` `#1fc8d3` `#27cad0` `#2ecdcc` `#35d0c9` `#3ad2c7` `#3dd5c4` `#3fd8c2` `#41dbc0` `#43debe` `#48e0bb` `#4ee3b8` `#57e5b4` `#62e6af` `#70e7aa` `#7de8a5` `#8be8a0` `#97e79c` `#a3e798` `#ade794` `#b7e790` `#c0e78b` `#c9e785` `#d3e77e` `#dde677` `#e7e66f` `#f0e568` `#f7e463` `#fde35f`
2. [Blue color palette](https://grabient.com/kWODO7tDo_07MP5nKD-ege_g?steps=32&angle=135): linear gradient, `#09183b` `#0a1b42` `#0b1f4c` `#0d2459` `#0e2967` `#102f76` `#123686` `#143c95` `#1643a2` `#174ab0` `#1851be` `#1958cc` `#1a60da` `#1c68e7` `#2071f3` `#267afc` `#3484ff` `#448eff` `#5398ff` `#61a1ff` `#6faaff` `#7db2ff` `#89bbff` `#96c2ff` `#a2c9ff` `#aed1ff` `#bad8ff` `#c6dfff` `#d1e5ff` `#dbebff` `#e3f0ff` `#e9f3ff`
3. [Peach pink plum gradient](https://grabient.com/kW0UwhXzK8dTGPjBuz8LzC-w?steps=32): linear gradient, `#feb08a` `#feac8a` `#fea889` `#fea389` `#fd9d8a` `#fc978b` `#fb918c` `#f98a8d` `#f8858e` `#f77f8e` `#f7798e` `#f7728e` `#f76b8d` `#f6648d` `#f35d8c` `#f0578b` `#ea518a` `#e34c87` `#db4884` `#d24480` `#c8407b` `#be3c77` `#b53972` `#ac356e` `#a3316a` `#9a2c66` `#912862` `#88245d` `#7f1f59` `#781c55` `#711952` `#6d164f`
4. [Monochrome brown to beige](https://grabient.com/kUVCQeSSdBV8nQl2jUDg?steps=32): linear gradient, `#4b2d21` `#503022` `#583424` `#603826` `#6a3e29` `#74432b` `#7f4a2d` `#8a502f` `#955731` `#9e5d33` `#a76435` `#ae6937` `#b46f39` `#ba753b` `#be7b3d` `#c3803f` `#c78642` `#ca8c45` `#cd924a` `#d19850` `#d49e57` `#d7a55f` `#dbac69` `#deb474` `#e1bb81` `#e5c38e` `#e8cb9b` `#ebd2a8` `#eed9b4` `#f1debf` `#f3e3c8` `#f5e7cf`
5. [Analogous dark blue to purple](https://grabient.com/kWRWHMLL_ALfKQNCRcGUDBEQ?style=radialGradient&steps=32): radial gradient, `#270f63` `#291066` `#2b106b` `#2e1170` `#311276` `#34137d` `#381483` `#3c1689` `#3f178e` `#431894` `#471a99` `#4c1b9e` `#501ca3` `#551ea8` `#5a20ac` `#5f22b0` `#6425b3` `#6828b5` `#6d2bb7` `#722eb9` `#7731ba` `#7c34ba` `#8238ba` `#883cb9` `#9040b7` `#9945b3` `#a34aae` `#ab50a8` `#b356a3` `#ba5c9e` `#be619b` `#c16598`
6. [Yellow orange red gradient](https://grabient.com/kW5nZFaTk9l8_PXURD4Scy-Y?steps=32&angle=270): linear gradient, `#fedf4b` `#ffdc49` `#ffd847` `#ffd346` `#ffcd44` `#ffc740` `#ffc13c` `#ffbb39` `#ffb636` `#ffb032` `#ffab2f` `#ffa52c` `#ff9f2a` `#ff9a27` `#ff9423` `#fe8e22` `#fd8822` `#fb8222` `#f97d23` `#f77723` `#f57224` `#f26c25` `#f06726` `#ee6126` `#eb5b27` `#e95427` `#e64d27` `#e44627` `#e13e28` `#df3728` `#dd3029` `#db2b29`

## Other forms

- [JSON](https://grabient.com/api/collections/three-color-gradients)
- [ASE](https://grabient.com/three-color-gradients.ase)
- [GPL](https://grabient.com/three-color-gradients.gpl)
- [GRD](https://grabient.com/three-color-gradients.grd)
- [Design tokens](https://grabient.com/three-color-gradients.tokens.json)
- [Image](https://grabient.com/api/png/collection?slug=three-color-gradients)
- [Social card](https://grabient.com/api/og/collection?slug=three-color-gradients&v=k4)
- [More collections](https://grabient.com/collections)
- [Guide for agents](https://grabient.com/llms.txt)