Vivid analogous orange to brown linear gradient

Linear gradient, 7 colors at 90°: #f1ba4a, #e9aa2a, #d99500, #c68200, #b36f00, #9f5d00, #915100. Edit and export CSS, SVG, PNG or a shader.

3 editable OKLCH keyframes.

• #f1ba4a
• #e9aa2a
• #d99500
• #c68200
• #b36f00
• #9f5d00
• #915100

CSS

background: linear-gradient(90deg in oklch, oklch(81.89% 0.1406 82.27) 0.0%, oklch(77.82% 0.1502 79.88) 16.7%, oklch(72.00% 0.1510 76.42) 33.3%, oklch(66.14% 0.1411 72.74) 50.0%, oklch(60.19% 0.1316 68.58) 66.7%, oklch(54.20% 0.1224 64.19) 83.3%, oklch(50.00% 0.1160 61.08) 100.0%);

In these collections

Orange gradientsHero section gradients

Similar palettesCollectionsDownload PNGPalette JSONMarkdownHow it works