Making a jagged image or background color section that is responsive
slanted lines in css
https://css-tricks.com/creating-non-rectangular-headers/#svg https://codepen.io/erikdkennedy/pen/zNpXee
Also interesting: https://9elements.com/blog/pure-css-diagonal-layouts/
I chose to go with the SVG approach.
inkscape straighten line inkscape crop svg inkscape snap lines to vertical
https://inkscape-manuals.readthedocs.io/en/latest/align-and-distribute.html
svg override fill color with css