Gradient Color Picker

Pick two colours and generate a smooth gradient — see all intermediate colour steps with their HEX and RGB codes.

🔒 Private — runs entirely in your browser ⚡ Instant conversion 🚫 No login required 🎯 Accurate W3C formulas

📖How to Use the Gradient Color Picker

1
Enter your colour
Type or paste your colour value into the input field, or use the visual picker. Try the sample buttons for quick examples.
2
See the converted values
All output fields update instantly as you type. A colour preview swatch also updates in real time.
3
Copy what you need
Click any Copy button to copy that specific value straight to your clipboard — ready to paste into your CSS, design tool or code.

FormatExample

HEX#0a6aff

RGBrgb(10, 106, 255)

RGBArgba(10, 106, 255, 1)

HSLhsl(215, 100%, 52%)

CMYKcmyk(96%, 58%, 0%, 0%)

PantonePantone 286 C

Is my data private?

Yes. All colour conversions happen entirely in your browser using JavaScript. No data is ever sent to a server.

Are the conversions accurate?

Yes. All maths follows the official sRGB colour space formulas defined by the W3C and ICC. Rounding is done to standard precision.