logo Oh My Color

Gradient Schemes

Curated beautiful gradient schemes to provide rich gradient inspiration for your design projects. Including 70 carefully selected gradient combinations.

Total 70 gradient schemes • Featured 21 gradients

Usage Guide

CSS Copy

Click any gradient card to copy its CSS code to clipboard

Gradient Application

Each gradient scheme is labeled with use cases, choose according to project needs

Tag Description

Gradients are categorized by tone, season, emotion and other dimensions

Featured Gradients

Gradients with 'Featured' tag are carefully selected high-quality combinations

Categories
RedOrangeYellowGreenBluePurplePinkGrayMultiNeutral
Click gradients to copy CSS code

Recommended Gradients

Featured
Featured
CSS Copy
Red3 colors
Featured
CSS Copy
Red2 colors
Featured
CSS Copy
Red3 colors
Featured
CSS Copy
Orange3 colors
Featured
CSS Copy
Orange3 colors
Featured
CSS Copy
Yellow2 colors
Featured
CSS Copy
Yellow2 colors
Featured
CSS Copy
Green2 colors
Featured
CSS Copy
Green2 colors
Featured
CSS Copy
Blue2 colors
Featured
CSS Copy
Blue2 colors
Featured
CSS Copy
Purple2 colors
Featured
CSS Copy
Purple2 colors
Featured
CSS Copy
Pink2 colors
Featured
CSS Copy
Pink2 colors
Featured
CSS Copy
Gray2 colors
Featured
CSS Copy
Gray2 colors
Featured
CSS Copy
Multi7 colors
Featured
CSS Copy
Multi2 colors
Featured
CSS Copy
Multi4 colors
Featured
CSS Copy
Neutral3 colors

All Gradients

CSS Copy
Red2 colors
CSS Copy
Red2 colors
CSS Copy
Red2 colors
CSS Copy
Red2 colors
CSS Copy
Orange2 colors
CSS Copy
Orange2 colors
CSS Copy
Orange2 colors
CSS Copy
Orange2 colors
CSS Copy
Orange2 colors
CSS Copy
Yellow2 colors
CSS Copy
Yellow2 colors
CSS Copy
Yellow2 colors
CSS Copy
Yellow2 colors
CSS Copy
Yellow3 colors
CSS Copy
Green2 colors
CSS Copy
Green2 colors
CSS Copy
Green3 colors
CSS Copy
Green2 colors
CSS Copy
Green2 colors
CSS Copy
Blue3 colors
CSS Copy
Blue2 colors
CSS Copy
Blue2 colors
CSS Copy
Blue2 colors
CSS Copy
Blue3 colors
CSS Copy
Purple2 colors
CSS Copy
Purple2 colors
CSS Copy
Purple3 colors
CSS Copy
Purple2 colors
CSS Copy
Purple2 colors
CSS Copy
Pink2 colors
CSS Copy
Pink2 colors
CSS Copy
Pink3 colors
CSS Copy
Pink2 colors
CSS Copy
Pink2 colors
CSS Copy
Gray2 colors
CSS Copy
Gray2 colors
CSS Copy
Gray3 colors
CSS Copy
Gray2 colors
CSS Copy
Gray2 colors
CSS Copy
Multi3 colors
CSS Copy
Multi3 colors
CSS Copy
Multi4 colors
CSS Copy
Multi5 colors
CSS Copy
Neutral2 colors
CSS Copy
Neutral2 colors
CSS Copy
Neutral2 colors
CSS Copy
Neutral3 colors
CSS Copy
Neutral2 colors
CSS Copy
Neutral2 colors