animation2code benchmark
For best compatibility, please view this dashboard in a Chrome browser.
← back

rendered animation

Waves CSS SVG Animation

1<div>
2  <svg viewBox="0 0 1320 500">
3    <path fill-opacity="0.5" d="
4          M0, 192
5          C220, 100, 440, 100, 660, 192
6          C880, 290, 1100, 290, 1320, 192
7          L1320 500
8          L0 500
9             "
10          fill="#000"/>
11     <path fill-opacity="0.5" d="
12          M0, 192
13          C220, 100, 440, 100, 660, 192
14          C880, 290, 1100, 290, 1320, 192
15          L1320 500
16          L0 500
17             "
18          fill="#fff"/>
19     <path fill-opacity="0.5" d="
20          M0, 192
21          C220, 100, 440, 100, 660, 192
22          C880, 290, 1100, 290, 1320, 192
23          L1320 500
24          L0 500
25             "
26          fill="#ee5253"/>
27     <path fill-opacity="0.5" d="
28          M0, 192
29          C220, 100, 440, 100, 660, 192
30          C880, 290, 1100, 290, 1320, 192
31          L1320 500
32          L0 500
33             "
34          fill="#00d2d3"/>
35  </svg>
36</div>
37