Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
svg wave with dropshadow
<svg viewBox="0 0 500 500" preserveAspectRatio="xMinYMin meet">
<defs xmlns="">
<filter id="dropshadow" height="130%">
<feGaussianBlur in="SourceAlpha" stdDeviation="3" />
<feOffset dx="2" dy="2" result="offsetblur" />
<feComponentTransfer xmlns="">
<feFuncA type="linear" slope="0.4" />
<feMergeNode in="SourceGraphic" />
<path d="M0,150 C150,250 350,0 500,150 L500,00 L0,0 Z" style="stroke: none; fill:#008193;filter: url(#dropshadow);"></path>
svg {
display: inline-block;
position: absolute;
top: 0;
left: 0;
body {
height: 100%;
width: 100%;
background-color: #008193;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment