Netflix Intro Animation

Sachin K Chaurasiya

Web Developer
CSS3
Netflix
<div _="@=1762,dis=none"><div _="@=1763,dis=none"></div></div>
1
<div id="container">
2
 <!-- Edit the letter attr to: N, E, T, F, L, I or X -->
3
 <netflixintro letter="N">
4
   <div class="helper-1">
5
     <div class="effect-brush">
6
       <span class="fur-31"></span>
7
       <span class="fur-30"></span>
8
       <span class="fur-29"></span>
9
       <span class="fur-28"></span>
10
       <span class="fur-27"></span>
11
       <span class="fur-26"></span>
12
       <span class="fur-25"></span>
13
       <span class="fur-24"></span>
14
       <span class="fur-23"></span>
15
       <span class="fur-22"></span>
16
       <span class="fur-21"></span>
17
       <span class="fur-20"></span>
18
       <span class="fur-19"></span>
19
       <span class="fur-18"></span>
20
       <span class="fur-17"></span>
21
       <span class="fur-16"></span>
22
       <span class="fur-15"></span>
23
       <span class="fur-14"></span>

CSS

<div _="@=2424,dis=none"><div _="@=2425,dis=none"></div></div>
1
*,
2
*::before,
3
*::after {
4
 margin: 0;
5
 padding: 0;
6
 box-sizing: border-box;
7
}
8
9
body {
10
 min-height: 100vh;
11
 background: black;
12
}
13
14
#container {
15
 display: flex;
16
 flex-direction: column;
17
 justify-content: center;
18
 align-items: center;
19
 width: 100%;
20
 height: 100%;
21
 background-color: #000000;
22
 overflow: hidden;
23
}
24

JS (TypeScript)

<div _="@=2845,dis=none"><div _="@=2846,dis=none"></div></div>
Partner With Sachin K
View Services

More Projects by Sachin K