SVG for pointy separators

Check it out!

This is an experiment in using SVG to divide up sections of the page. The “pointy bit” is an SVG – try resizing the window to see how it changes.

The fill colour of the SVG is set using the “color” property in CSS, matching the background of the section before it.

It’s a little bit of a “rough and ready” implementation just to get a feel for it 😄

It’s pretty nice, right?

I think I might do a bit more experimentation with angles at section ends.

It might be nice without such a uniform chevron effect 🤔