Gradient review

Gradient is a cheap and cheerful program for creating CSS3 colour transitions. These can be used for page backgrounds, buttons and other block elements on your website.

Web design has come a long way from the days when animated GIFs and blinking text were de rigueur. Developers have much more control over the look and layout of a page, with HTML5 and CSS3 support as the baseline for modern web browsers. But, sometimes those script features don’t seem any easier to implement than the old hacks we used to use.

Such is the case with CSS3-powered gradients. To create them by hand you have to program transitions manually. The code generated is a long list of colour definitions and declarations. Gradient makes it easy, by putting a slick and intuitive user interface over the top.

The tool enables you to easily choose start and end points for a gradient. These can be picked from standard colour pickers, entered in web-friendly notation or picked from an image. When you’ve settled on a scheme, you choose whether to generate a linear or radial gradient, a direction for it to render, and which browsers you want to support. At the final stage you can copy and paste the code into your external style sheet for use in a page.

Gradient takes the tedium out of scripting CSS3 colour transitions


If Gradient has any flaws, it’s that it feels like a feature rather than an app. It seems like there should be a suite of similar tools to complement it. But, at well under a fiver, we’re not complaining.

Find the best price

Best prices today

Retailer Price Delivery  

Price comparision from , and manufacturers