Comments (0)
CSS
px
%
width: 500px; height: 500px; background: repeating-linear-gradient(-23deg, rgb(255 255 255 / 0) 0%, rgb(255 255 255 / 0.22) 1.3%, rgb(69 168 255 / 0) 2.7%, rgb(69 168 255 / 0) 2.7%) 0px 0px / 500px 500px no-repeat no-repeat, /* Thin lines */ repeating-linear-gradient(-71deg, rgb(255 255 255 / 0) 0%, rgb(255 255 255 / 0.17) 6.88%, rgb(69 168 255 / 0) 14.29%, rgb(69 168 255 / 0) 14.29%) 0px 0px / 500px 500px no-repeat no-repeat, /* Thick lines */ linear-gradient(344deg, rgb(255 255 255 / 0) 25%, rgb(238 64 64 / 1) 44.49%, rgb(237 155 64 / 1) 62.87%, rgb(69 168 255 / 0) 77.21%) 0px 0px / 500px 500px no-repeat no-repeat, /* Color gradient 1 */ linear-gradient(21deg, rgb(255 255 255 / 0) 61.4%, rgb(38 3 3 / 1) 100%) 0px 0px / 500px 500px no-repeat no-repeat, /* Color gradient 2 */ linear-gradient(314deg, rgb(88 37 183 / 1) 6.99%, rgb(61 170 245 / 1) 28.68%, rgb(69 168 255 / 0) 51.1%) 0px 0px / 500px 500px no-repeat no-repeat, /* Color gradient 3 */ linear-gradient(27deg, rgb(69 255 144 / 1) 50.74%, rgb(69 168 255 / 0) 100%) 0px 0px / 500px 500px no-repeat no-repeat; /* Color gradient 4 */

Soft Line Gradients

Yoav Kadosh

Colors

Views

1,400

Layers

6
Open in editor
Layers (6)
Thin lines
linear
Thick lines
linear
Color gradient 1
linear
Color gradient 2
linear
Color gradient 3
linear
Color gradient 4
linear