Home

SVG Creator

Draw shapes, lines, and text to build your own SVG, then export it. Everything autosaves to this browser only — no account, no server.

Thickness

Pick a tool above, then click or drag on the canvas to draw.

Canvas

Select a shape on the canvas to edit its fill, outline, and layering.

Export

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200">
<defs>
<filter id="svemoji-outline-crayon" x="-30%" y="-30%" width="160%" height="160%">
<feTurbulence type="fractalNoise" baseFrequency="0.8" numOctaves="3" seed="2" result="n"/>
<feDisplacementMap in="SourceGraphic" in2="n" scale="3" xChannelSelector="R" yChannelSelector="G"/>
</filter>
<filter id="svemoji-outline-marker" x="-30%" y="-30%" width="160%" height="160%">
<feTurbulence type="fractalNoise" baseFrequency="0.02" numOctaves="1" seed="2" result="n"/>
<feDisplacementMap in="SourceGraphic" in2="n" scale="0.6" xChannelSelector="R" yChannelSelector="G"/>
<feGaussianBlur stdDeviation="0.5"/>
</filter>
<filter id="svemoji-outline-oilbrush" x="-30%" y="-30%" width="160%" height="160%">
<feTurbulence type="fractalNoise" baseFrequency="0.05" numOctaves="2" seed="2" result="n"/>
<feDisplacementMap in="SourceGraphic" in2="n" scale="4" xChannelSelector="R" yChannelSelector="G"/>
<feGaussianBlur stdDeviation="0.3"/>
</filter>
<filter id="svemoji-outline-pencil" x="-30%" y="-30%" width="160%" height="160%">
<feTurbulence type="fractalNoise" baseFrequency="1.2" numOctaves="2" seed="2" result="n"/>
<feDisplacementMap in="SourceGraphic" in2="n" scale="1.1" xChannelSelector="R" yChannelSelector="G"/>
</filter>
<filter id="svemoji-outline-watercolor" x="-30%" y="-30%" width="160%" height="160%">
<feTurbulence type="fractalNoise" baseFrequency="0.03" numOctaves="2" seed="2" result="n"/>
<feDisplacementMap in="SourceGraphic" in2="n" scale="6" xChannelSelector="R" yChannelSelector="G"/>
<feGaussianBlur stdDeviation="1.1"/>
</filter>
</defs>
</svg>

My designs

Draw a shape to start saving designs — they're stored in this browser.