Skip to content

Instantly share code, notes, and snippets.

@RemiDuvoux

RemiDuvoux/wave.html

Created December 20, 2016 17:53
Show Gist options
  • Save RemiDuvoux/45a518775f1294dc46d7164605983706 to your computer and use it in GitHub Desktop.
Save RemiDuvoux/45a518775f1294dc46d7164605983706 to your computer and use it in GitHub Desktop.
Download ZIP
Nice wave effect (svg and linear gradient)
Raw
wave.html
<div id="wave" style="background-image: linear-gradient(-270deg, #10A799 0%, #48DD75 100%); margin-top:-1px";>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1170 193" style="fill: white; margin-top: -1px">
<path d="M1175 131.2c0 0-81-89.4-224.3-103.4S713 72 665 97c-86 46-148 63-271 7C221.7 25.5 56 104.5-4 197.4 -4 58.7-3.3 0.3-3.3 0.3L1175 0V131.2z"/>
</svg>
</div>
<div class="wrapper" style="background-image: linear-gradient(-270deg, #10A799 0%, #48DD75 100%); height: 100vh">
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment