How to implement with SVG?

Question

css

Hello!
Guys, tell me, please, how can I implement such a "wave" using SVG (or something else?), Given that the block itself will contain content?

If anyone else can post a clear guide to SVG for noobs, I'd be mega grateful!
Thanks to all!

Answer 1

There's a good tutorial on SVG at developer.mozilla.org , and it's especially helpful to read about paths - I've seen waves like this done through bezier curves. And as always, there are examples on codepen, for example , this one . But it is worth remembering that in general it may be easier to draw what you need in a graphics editor and export it than to pick up the numbers by hand.