Waves

Designed by
Yoav Kadosh

Keywords:

Colors:

A wavy pattern made from two radial CSS gradients

Layers
2
Views
145
Open in Editor

Layers

Left Wave
(radial)
Right Wave
(radial)

CSS

width: 500px;
height: 500px;
background:
radial-gradient(circle at 100% 50%, rgba(69,255,144,0) 20%, rgba(69,168,255,1) 21%, rgba(69,168,255,1) 34%, rgba(255,255,255,0) 35%) 0px 0px / 75px 100px repeat repeat, /* Left Wave */
radial-gradient(circle at 0% 50%, rgba(69,255,144,0) 20%, rgba(69,168,255,1) 21%, rgba(69,168,255,1) 34%, rgba(255,255,255,0) 35%) 0px 50px / 75px 100px repeat repeat; /* Right Wave */