Did-It-Myself SVG Monogram Tutorial
Part One: Picasa

June 10, 2013

DIY SVG Circle Monogram Tutorial by Hey, It's SJ
I love monograms, maybe because I just love my name; I love that it's unique, and I love the history behind it! My parents named both my sister and me after relatives -- My grandmother's name is Sarah and my mom's name is Jean. They thought there were too many just plain Sarah's (and there are quite a few) so they decided to call me by both my first and middle name, Sarah Jean.  A lot of my close friends and family just call me SJ for short, and I jump at any chance I get to put my initials/monogram on something. So here's how I made my own monogram in SVG format...

Wait, what is SVG? SVG stands for Scalable Vector Graphics. According toWikipedia, "SVG is an XML-based vector image format for two-dimensional graphics that has support for interactivity and animation." There's a bunch more technical jargon that goes into it, but basically the biggest difference between SVG and a typical graphic file, such as a .JPEG or .GIF, is that a vector graphic can be scaled (i.e. enlarged) while preserving its shape--there are no pixels! This means with a single SVG file you can make a HUGE canvas or a tiny business card. You can create SVG files with programs like Adobe Illustrator or Inkscape.

Now on to the monogram making... The first step in making my own SVG monogram was to find a monogram alphabet. I love the geometric, clean lines of a circle monogram, and I ended up choosing this alphabet to use as a template. I recommend choosing a file that is fairly large to avoid the letters being too pixelated; the file I used wasn't an SVG file, so if I had to enlarge any of the letters I was going to lose some of the definition. For reference, the file I chose was 1062x1408 pixels. Next I needed to do some cropping and chopping. I opened my file in Picasa to edit my image. Here's how I made my edits: 
DIY SVG Circle Monogram Tutorial by Hey, It's SJ
DIY SVG Circle Monogram Tutorial by Hey, It's SJ
DIY SVG Circle Monogram Tutorial by Hey, It's SJ
DIY SVG Circle Monogram Tutorial by Hey, It's SJ
DIY SVG Circle Monogram Tutorial by Hey, It's SJ
DIY SVG Circle Monogram Tutorial by Hey, It's SJ
DIY SVG Circle Monogram Tutorial by Hey, It's SJ

After I had three separate files for each of the three letters in my monogram, I was ready to use Inkscape to create my SVG Monogram.

You can read part two of my tutorial here: Part Two: Tracing in Inkscape

And here's Part Three: Editing Nodes and Paths in Inkscape

**UPDATE 4.11.14 You can now purchase the complete circle monogram alphabet SVG file in my Etsy shop!