lignes

<svg width="400" height="400">
<rect width="400" height="400"/>
<path d="M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400" stroke="white" stroke-width="4" fill="none" opacity="0.5">
<animate attributename="d" begin="0s" repeatcount="indefinite" dur="6s" values="
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 000,400 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 400,000 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400"/>
</path>
<path d="M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400" stroke="white" stroke-width="4" fill="none" opacity="0.25">
<animate attributename="d" begin="0.2s" repeatcount="indefinite" dur="6s" values="
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 000,400 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 400,000 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400"/>
</path>
<path d="M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400" stroke="white" stroke-width="4" fill="none" opacity="0.5">
<animate attributename="d" begin="0.4s" repeatcount="indefinite" dur="6s" values="
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 000,400 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 400,000 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400"/>
</path>
<path d="M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400" stroke="white" stroke-width="4" fill="none" opacity="0.25">
<animate attributename="d" begin="0.6s" repeatcount="indefinite" dur="6s" values="
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 000,400 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 400,000 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400"/>
</path>
<path d="M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400" stroke="white" stroke-width="4" fill="none" opacity="0.5">
<animate attributename="d" begin="0.8s" repeatcount="indefinite" dur="6s" values="
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 000,400 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 400,000 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400"/>
</path>
<path d="M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400" stroke="white" stroke-width="4" fill="none" opacity="0.25">
<animate attributename="d" begin="1s" repeatcount="indefinite" dur="6s" values="
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 000,400 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 400,000 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400"/>
</path>
<path d="M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400" stroke="white" stroke-width="4" fill="none" opacity="0.5">
<animate attributename="d" begin="1.2s" repeatcount="indefinite" dur="6s" values="
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 000,400 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 400,000 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400"/>
</path>
<path d="M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400" stroke="white" stroke-width="4" fill="none" opacity="0.25">
<animate attributename="d" begin="1.4s" repeatcount="indefinite" dur="6s" values="
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 000,400 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 400,000 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400"/>
</path>
<path d="M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400" stroke="white" stroke-width="4" fill="none" opacity="0.5">
<animate attributename="d" begin="1.6s" repeatcount="indefinite" dur="6s" values="
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 000,400 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 400,000 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400"/>
</path>
<path d="M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400" stroke="white" stroke-width="4" fill="none" opacity="0.25">
<animate attributename="d" begin="1.8s" repeatcount="indefinite" dur="6s" values="
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 000,400 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 400,000 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400"/>
</path>
<path d="M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400" stroke="white" stroke-width="4" fill="none" opacity="0.5">
<animate attributename="d" begin="2s" repeatcount="indefinite" dur="6s" values="
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 000,400 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 400,000 300,300 400,400 400,400;
M 0,0 C 0,0 100,100 200,200 300,300 400,400 400,400"/>
</path>
</svg>