Why SVG (and Snap)?
SVG is an excellent way to create interactive, resolution-independent vector graphics that will look great on any size screen. And the Snap.svg JavaScript library makes working with your SVG assets as easy as jQuery makes working with the DOM.
Tools Svg, Mechanical Tools Svg, Carpenter Tools Svg, Hand Tools Svg, Handyman Svg, Workshop Svg, Labor Day Svg, Father's Day Svg, Tool Box designedbyri $ 4.99. 2) SVG Path Generator by mathisonian. This tool gives you the power to create SVG paths easily, without having to memorize any shortcodes or specs. This is a great example of how independent users find ways of making the use of SVG file formats simpler all the time. 3) Anthony Dugois’s SVG Path Builder. This tool lets you create SVG paths. Inkscape is an open source SVG editor for Windows. This famous vector graphics editor is a cross platform software for Windows MAC, and Linux. It has various editing tools which give you the freedom to draw vector designs easily. The tool bar is present on the left hand side of the UI, and contains drawing and editing tools.
Modern features for modern browsers
Snap.svg is designed for modern browsers and therefore supports the newest SVG features like masking, clipping, patterns, full gradients, groups, and more.
Inject life into your SVG
With a rich animation library and easy event handing, Snap.svg lets you bring your SVG to life.
Source agnostic
Of course you can generate SVG with Snap, but you can also use Snap to work with SVG generated from tools like Adobe Illustrator, Inkscape, or Sketch. You can even load strings of SVG asynchronously and query out the pieces you need in order to turn SVG files into sprite sheets.
Open-source and free
Snap.svg is available under an Apache 2 license which means it’s completely open-source, and completely free.
Getting Started with Snap
Got questions? Ask them on the Snap.svg forums.
Get Snap now
Download Version 0.5.1You can also clone Snap from GitHub.
My list of web-based SVG makers, converters and utilities
For Cutting
Templates, Shapes and Typography
- Template Generator (formerly Ideogram) – Boxes, Envelopes, Solids, Frames and more; my tutorial here
- Gear Generator (hub will need to be recentered)
- Jigsaw Puzzle Generator (set color to white after import or hide contour of rectangle)
- Box Generator – Parameterized boxes and parts
- Clock Face Generator also digital clock, grids, number lines
- Calendar Generator(change extension to .svg)
- Star/Shaded Star (copy code to text document and change extension to .svg)
- Polyskelion (copy code to text document and change extension to .svg)
- Word Cloud Maker (run output through SVG Optimizer)
- Boxmaker with optional window
- Stencilfy – convert text to stencil text or create properly spaced text
- US States Design Generators (mandala filled, monogram frames, etc)
Maps and Charts
- Street Maps(click share icon then pulldown to svg)
- Chart Generator– Pie Charts, etc
- Star Chart Generator (use SVG Crowbar)
Svg Tools
Photo/Raster to Vector Conversion
- Stencilizr (formerly Stencilgram) my tutorial here
- PNGtoSVG image to multicolor SVG
- Photo to Stencil (two or 3 color) my tutorial here
- Photo to SVG (multilayer)
- Rapid Resizer my tutorial here
- Bay Stencil (formerly Stencilizer) my tutorial here
Svgtools
Generative Art
- Ink Rays – Generative compositions
- SVG-Generator.de – various generative options
For Drawing (writing, engraving, etching, foiling, plotting, etc.)
Shapes – Open Path
- WaveMaker (copy code to text document and change extension to .svg)
- SpiralMaker (Archimedian or Fibonnaci)(copy code to text document and change extension to .svg)
- Mandala Creator (click save as SVG button then Save Page As)
Maps- Open Path
Photos/Images to Vector Lines
- Centerline Trace
Single Line Text
Svg Tools
- Single Line Text Generator (from templatemaker.nl)
- Sandify (continuous text)
Generative Art
- Vectorizer – interesting generative designs
- Turtle Toy trees, cities, islands and much more
- 3D Bars (use SVG Crowbar)
- Designs by Karl Sluis rotating lines, polygons, boxes and more
- SVG-Generator.de – for line art choose Rotating Ellipses, Straight Lines Curved Lines or Baum Render
- Delaunay Stripes click to random generate, press d to download SVG
- Sandify various patterns and shapes
- OverFlower (use line art setting)
SVG Editors
Utilities
- SVG to CNC – SVG optimizer for Cricut
- Nest – Fit SVGs into an area
- Joinery – generates connecting versions
- SVG Crowbar (Chrome bookmarklet for extracting SVGs)
- Win2PDF (Windows virtual printer that can “print to SVG”)