Pictures
Make a CSS gradient
Get the main colours of a picture, pick the colour of any spot, mix two colours or make a smooth colour blend for a website.
What do you want to do?
Choose the blend
Shape
0° goes up, 90° goes to the right.
#E84A5Fat%
#F5C342at%
After each change, the colours and the shape are sent to the AnnoDev server, which makes the CSS code and sends it back. How files are handled
Your gradient
Making the gradient
How it works
- Choose what you want to do at the top.
- Add a picture, or pick colours with the colour boxes.
- Press a code to copy it. Paste it into your website, document or design app.
Colour codes in plain words
- HEX, like #E84A5F: the short code most apps accept.
- RGB: how much red, green and blue, from 0 to 255.
- HSL: the colour on a wheel, how strong it is, and how light.
CSS Gradient Generator: Linear and Circle
Make a smooth linear or circular colour blend and copy the CSS code for your website. Free CSS gradient generator.
A palette summarises the colours in your image; a pixel picker reports one selected spot. For website text, also check foreground/background contrast before using a colour combination.