CSS Generators

SVG to CSS Shape Converter

This tool will convert an SVG shape created with one or multiple <path d="..."> elements into a CSS Shape. You will get a responsive code made with the new shape() function.

It's a single-element implementation that works with images and supports gradient coloration!

Paste your SVG paths below. You can add as many paths as you want!

Example of CSS Shapes