Generate a Colour Spectrum
Make a full-hue spectrum image at any size and angle — every hue from red back to red, as a PNG.
Free preview · No signup · ~10 seconds
Free downloads are 60% size. Create a free account for the full-resolution, lossless file.
Get the full-quality fileThe account is free. Exporting at full quality uses one credit — packs start at €0.99 for 3, with no subscription.
What a spectrum strip is good for
A full turn of the wheel
The ramp runs through every hue at full saturation and lands back on red, so there is no visible seam if you tile it or wrap it. That closure is why it is built from thirteen stops rather than twelve.
Wide and short by default
The default is 1200 by 200 because a spectrum is almost always wanted as a strip rather than a block — a legend, a picker track, a decorative rule. Change the height if you need a full-bleed background.
The angle rotates the ramp
Zero runs left to right, which is what a horizontal picker or legend wants. Ninety runs top to bottom for a vertical track.
Not a data visualisation palette
A rainbow ramp is a poor choice for encoding values: it is not perceptually uniform, so equal steps in the data look like unequal steps in colour, and it fails for colour-blind readers. Use it as decoration or as a hue picker, not as a scale on a chart.
Lossless PNG
The transitions stay smooth. A JPG would put compression blocks straight across the gradient, which is where they are most obvious.
Using a spectrum well
Not for encoding data
Rainbow ramps distort the values they display and exclude colour-blind readers. Keep them decorative or use them as a hue picker.
It tiles seamlessly
The ramp closes back on red, so you can repeat it horizontally without a visible join.
Strip, not a block
The common use is a legend or picker track, which is why the default is wide and short.
How to generate a colour spectrum
Set the angle
Zero for a horizontal strip, ninety for a vertical one.
Set the size
1200 by 200 suits a legend or picker track. Raise the height for a background.
Download
Free preview, or the full-resolution PNG in the app.
Where a hue ramp gets used
Hue picker tracks
Build the background strip for a custom colour picker.
Legends and keys
Produce a reference strip for a design system doc.
Decorative rules
Add a spectrum divider to a page or slide.
Display testing
Check colour reproduction on a screen or a print proof.
Or just ask
Describe the edit in your own words
Type what you want changed and the assistant does it on the canvas — each step lands as a layer you can reopen, so nothing it does is baked in.
No edits yet.
Frequently Asked Questions
Related Tools
Guides worth reading
How to Fix Blurry or Fringed Edges on a Transparent PNG
Why your transparent PNG has a white halo, a grey fringe or soft edges — the four real causes, how to tell them apart in seconds, and the fix for each.
SVG vs PNG for Logos: Which File Do You Actually Need?
What SVG and PNG really are, where each one wins, why your developer keeps asking for the SVG, and the three files that cover almost every request.
What to DIY and What to Pay a Designer For
Where design money actually earns its return at pre-seed, where it doesn't, and the honest line between the work worth commissioning and the work worth doing yourself.
Generate a colour spectrum
Every hue, at any size.