How to Add a Double Border to SVG Shapes

Mariana Beldi
Level Up Coding
Published in
4 min readMay 4, 2021

--

Let’s say someone asks you to add a double border to some random geometric SVG shapes. For some reason, you can’t use any graphic editor — they need to be generated at runtime — so you have to solve it with CSS or within the SVG syntax.

Your first question might be: Is there anything like stroke-style: double in SVG? Well, the answer is not yet and it’s not that easy. But I’ll attempt it…

--

--