Awesome Open Source
Awesome Open Source


A curated collection of splendid gradients made in CSS3, .sketch and .PSD formats. View all the gradients here »


How To Use

  1. Download the file webgradients.css.
  2. Place the file in your project folder.
  3. Link the file it in the <head> of your document.
    <link href="webgradients.css" rel="stylesheet">

Browser Compatibility

Some gradients uses the background-blend-mode CSS property. It's supported by the majority of the modern browsers. View full compatibility list (view on Caniuse) »

You can learn more about background-blend-mode here (view on MDN) »


WebGradients is created under the MIT license.

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
Css (217,004
Frontend (6,613
Ui (5,274
Design (2,593
Color (2,104
Gradient (429
Background (345
Palette (317
Related Projects