How to use
- Choose two colors first, then add a third stop only when the gradient still feels too abrupt.
- Pick linear or radial mode and a direction preset.
- Copy the CSS string or individual stop colors into the next tool or design spec.
Wave 46 expansion
Move from palette choice to applied output
This page sits after color selection and before final format or contrast checks. It helps when approved colors now need a usable background treatment.
How to choose between nearby pages
Use Color Picker or Color Mixer when the colors themselves are still undecided. Use Color Palette Generator when one base color still needs nearby options. Use this page once the colors are approved and the next task is a real gradient treatment. Move to Color Converter for notation handoff, and move to Contrast Checker when text readability on top of the gradient matters.
FAQ
What does this page do?
It builds a simple linear or radial CSS gradient from two or three colors, then shows the CSS string and a live preview.
When should I use this instead of Color Palette Generator?
Use Color Palette Generator when you want nearby swatch candidates from one base color. Use this page when the next task is an applied gradient background or UI fill.
Does it export design files?
No. It creates a CSS gradient string and a preview only. You can copy the individual colors into other tools if needed.
What is stored in the share URL?
The share URL stores the selected colors, gradient mode, direction, and whether the third stop is enabled.