Netflix Logo

Designed by
Yoav Kadosh

Keywords:

Colors:

Layers
5
Views
209
Open in Editor

Layers

Circular bottom mask
(radial)
Top/bottom mask
(linear)
Diagonal
(linear)
Mask
(linear)
Background
(solid)

CSS

width: 500px;
height: 500px;
background:
radial-gradient(ellipse at 50% 100%, rgba(0,0,0,1) 50%, rgba(0,0,0,0) 51%) 0px 355px / 500px 120px no-repeat no-repeat, /* Circular bottom mask */
linear-gradient(0deg, rgba(0,0,0,1) 19.5%, rgba(255,255,255,0) 20%, rgba(255,255,255,0) 80%, rgba(0,0,0,1) 80.5%) 0px 0px / 500px 500px no-repeat no-repeat, /* Top/bottom mask */
linear-gradient(-110deg, rgba(0,0,0,0) 42%, rgba(0,0,0,0.4) 45.5%, rgba(229,9,19,1) 46%, rgba(229,9,19,1) 54%, rgba(0,0,0,0.4) 54.5%, rgba(0,0,0,0) 58%) 0px 0px / 500px 500px no-repeat no-repeat, /* Diagonal */
linear-gradient(90deg, rgba(0,0,0,1) 32.5%, rgba(255,255,255,0) 33%, rgba(0,0,0,0) 43.5%, rgba(0,0,0,1) 44%, rgba(0,0,0,1) 56%, rgba(0,0,0,0) 56.5%, rgba(255,255,255,0) 67%, rgba(0,0,0,1) 67.5%) 0px 0px / 500px 500px no-repeat no-repeat, /* Mask */
linear-gradient(rgba(169,0,8,1), rgba(169,0,8,1)) 0px 0px / 500px 500px no-repeat no-repeat; /* Background */