How to Make a Pop Up Card SVG for Free in Inkscape

· ·

Finding free pop up card SVG files is now even easier, because after this tutorial you will be making your own in Inkscape.

This tutorial is a bit more advanced in terms of inkscape and SVG tutorials – if you are just beginning your journey in SVG creation then please check out my Inkscape 101 playlist on Youtube and definitely learn about score lines and perforation lines before you test this out. It will definitely help with the creation of your pop up card SVG files.

I was so excited to figure out how to make free pop up card SVG files – and I will be adding some to my free SVG library. These take a little but of time but with practice, you will master them and be able to adopt these techniques to create your own files.

Pop Up Card SVG Basics

The main thing to consider with a pop up card is that you need to make a backing and the pop up will be on the insert. Make sure to consider the height or width of your image and this technique won’t work with EVERY image but test it out and be patient. I tested this image over 6 times, cutting, adjusting, cutting and adjusting. Since pop up card SVG files take a little more precision than a flat SVG, you may make mistakes and that’s ok. The end result when you finally figure it out is so rewarding, I was so happy to get this right and am hoping to enjoy the ride too!

Make Your Main SVG Image

Creating a pop up card SVG in inkscape for free
Type image caption here (optional)

To start, make your main image, I am not going to dive into the depths of making an SVG but you can check out my beginners guide here. I am using a mix of text and a heart to create this Mother’s Day Pop Up card SVG file. I like to work off a duplicate of the image because then I keep the original SVG and cut that out with colored card stock and glue it on top.

Once I have my image, I removed the fill and left only the stroke lines, you will be working with all stroke lines until we get to the backing. You want to remove the space where you will be extending. You can use the delete segment between nodes like in the photo below.

Creating a pop up card SVG in inkscape for free - adding stroke lines

From here, we need to make extensions to the top of our objects, this is where the pop out with be. Keep in mind the size of your card and the size of your pop out. I made mine relatively small, but enough to give a 3D look. How many of these you add honestly doesn’t matter, you can have a bunch of small ones or even one large but I am going to add them to the top of my Ms and my heart. You need these to all be aligned at the top. Copy and save one set of lines for marking the bottom later.

Creating a pop up card SVG in inkscape for free - combining stroke lines

From here you can attach using Path, then Combine (NOT UNION) because we are working with stokes and not paths. Once the new stroke lines are attached, we need to remove the strokes in between (I did mine before but either way is fine as long as they are removed). So this means the tops of the M’s and in between the tops of the heart. You can use the break nodes or delete between nodes button to delete. You may need to add nodes in to make sure you don’t lose any of the stoke that you need.

Creating a pop up card SVG in inkscape for free - removing stroke lines

Let’s make our card liner, this is going to be where the pop out SVG is added. I am going to make my insert 4.5 inches wide by 8.5 inches tall. I like to make mine gray so I can see it and I remove the stroke.

Creating a pop up card SVG in inkscape for free - adding in the insert layer

Next, add a score line to the middle with a stoke that is a little shorter than the width. I go with about 4.3 inches and then I center it to that insert. We need to keep the middle marked so do not move this line!

Creating a pop up card SVG in inkscape for free

Now we are going to take that extra set of “pop out” lines and move those to the middle and below the score line we just added. The bottom of our pop out needs to be equal to this at the bottom. So the distance from the middle to the bottom of what your pop out is, is equal to what the pop out size is at the top. We will move our stroke line SVG file, the pop out image, over to where we just put those markers. I centered my MOM SVG and aligned it to the bottom. This put the point of my heart right in the center. The middle score line is not at the bottom its slightly up, this is correct!

Creating a pop up card SVG in inkscape for free

Next, I am going to add those lines that were our markers to the heart since the point is going to be hard to connect. Use the same technique were we attach with COMBINE and then delete the stokes in between.

Now, let’s add some small perforation stoke lines in between at the top of the pop up SVG file, at the place where it turns back down (the top of the M and the bumps of the heart), and at the bottom. Make these stoke lines small because you want the paper to stay attached and not rip.

Creating a pop up card SVG in inkscape for free adding the perforation lines

Next, go ahead and COMBINE (again don’t use union) all of these lines except the middle score line. That we will save for after so we can perforate it.

Creating a pop up card SVG in inkscape for free combining the perforation lines

Once we are lined up and ready, you will go to your fill and stroke panel then go to the stroke style section. Keep the lines solid but change the SVG strokes to .01 this will make the line EXTREMELY thin which is what we want.

thinning the Creating a pop up card SVG in inkscape for free

Next, the score line through the middle we want to change to a perforation line. So go to the stroke style section again, then go to the dashes. DO NOT CHANGE THIS THICKNESS. Change the dash lines by going to Path, Stroke to Path. Then go to width and change it to .001. From there, recenter it to the backing. Make sure the backing did not move.

adding a perforation line to a card in inkscape

Now, delete any nodes that are over the pop out card SVG file and any that cross over the SVG as well. You don’t want any too close to the cut out because the paper of the card will tear.

editing the perforation line

Now, we will UNION the two objects (you can also do this seperately) – they are both paths now so we use this option. Once they are unioned to finish the pop up card SVG file you will grab the backing and the object and use the difference option. Once you do this you might think the image complete disappeared because the lines are so thin you can’t see them, but if you go into node mode, you will see where your machine is going to cut them.

looking at cut lines

Finally, create another rectangle, since my pop up card SVG insert is 4.5 by 8.5 I will make my backing card 5 x 9. This way I know the boarder around it is even.

finished pop up card svg file

Now, you have created your own Pop Up SVG file for FREE! Don’t stress if it’s not perfect the first time, second time, third time. These are not easy!! Keep trying and practicing. That is how I learn, trial and error.

Stay Crafty!

More Posts You'll Love

Leave a Reply

Your email address will not be published. Required fields are marked *