x Did you like it? Well, then please consider making a donation :)

GradientLinear gradient + Radian gradient

Color gradient is an image derived by the flow of one color into another. The first that comes into one's mind is the standard theme Ubuntu or Windows XP. Using the gradient correctly it is possible to solve some problems of the web site: the excessive contrast range or the lack of the contrast. This can cause some problems for people living in imperfect world who can have troubles with the computer monitors or the working space next to the window, or the sun shining too brightly. Whether you like it or not, the background and the contrast range define the comfortable use of the site by you, your client and the user. We have answered the question why to use the gradient.

The further question is how to use it. There are two variants: the picture and CSS3.

How to use the gradient in Photoshop, illustrator or in flash? Let's start with the picture. As practice shows, working with the gradient the use of more than two colors is possible. In addition you can indicate the settings of the transparency. There are the main types of the gradients which depend on the required final result: linear, circular, angular, reflected and diamond-shaped. The type of the gradient is set by the tools of the setting panel. Read more.


Gradient generator




Linear gradient


Radial gradient


Nowadays web designers prefer linear gradient. The correct indication of the gradient direction is important here:

The wheels of progress never stop turning. The browser support is getting better every day. So it is essential to understand how to use the CSS gradient efficiently. Besides, gradient is a powerful tool for creating various textures and backgrounds without image.

Nowadays the modern web designer has the opportunity to create the gradient color fill using CSS code without images. The list of browsers that support CSS gradients are Firefox 3.6, Google Chrome, Safari, Internet Explorer 5.5, Opera 11.