<svg width="500" height="300" >
<clipPath id="myClip">
<path d="M 0.0 112 L 20 124 L 40 129
L 60 126 L 80 120 L 100 111
...
L 61 179 L 42 171 L 30 159
L 13 140 L 00 112 Z"/>
</clipPath>
<g id="grid"
style="stroke:none; clip-path:url(#myClip)">
<rect style="fill:red" x="0" y="0"
width="500" height="20" />
...
<rect style="fill:yellow" x="0" y="260"
width="500" height="20" />
</g>
</svg>
|
|
But you have already seen lots of examples! A more "serious" one...