ssshape
SVG blob/shape generator that puts you in the driver's seat

start by drawing a few points ↷

when you're happy, click the ssshape button ↷

tweak it using the control buttons ↷

patterns:

patterns:

Some sample SVG shapes created using this tool ↷

example SVG shape 1 example SVG shape 2 example SVG shape 3 example SVG shape 4 example SVG shape 5 example SVG shape 6 example SVG shape 7 example SVG shape 8 example SVG shape 9 example SVG shape 10

I don't know for you, but I've always struggled with using bezier curve drawing tools in vector drawing apps. I seem to never get to the shape I actually wanted. I created this tool in part to help with that, and in part to have an easy online tool where we can create blobs with control over the final shape.

This tool allows to create organic-looking blob-like shapes. All you have to do is draw a few points, click on ssshape and the tool will take take of drawing a smooth shape around those points.

You can then tweak the shape's size, angle and even skew it, so that you get exactly what you were looking for. Then simply copy the SVG markup or save the SVG file for direct use on the web in your CSS or HTML, or in a vector graphic editor.

This tool is made possible thanks to SVG.js, the spline function from George Francis' generative-utils library, and the Doodad Pattern Generator.

I'd love to see the projects you create with the shapes created here, so feel free to share with me here.