How do you make a transparent background layer using Inkscape?

jckmcgraw

Hello Everybody,

I have been able to avoid knowing how to do this because I have been using preview on all of my .png images to make the backgrounds transparent. Right now, I am making some custom font writing (.pngs), and I keep having white in all of the closed off letters. EX: "O","D" ect....

If anybody has a quick solution, that would be awesome. If not, I'll head on over to Inkscape's site and dig through a bunch of tutorials.

Thanks!
Jack McGraw

Lano

My solution will be this simple steps:

1. create square/rectangle or design that similar to that closed off letter;
2. put that object inside the letter exactly the location of that area you want to make transparent;
3. select all objects (in this case, the letter and the object you made in step 1 and 2);
4. click menu > path > difference.

That's it! ... and make sure to convert all objects to path before following this steps.

SpriteAttack

@jckmcgraw - I am trying to work out what the problem is you are talking about. When you create a custom font and do e.g. an O - you would have to circles for a very simple O. Are you doing one in black and then putting a white one on top? The key is to combine them and have just one object. Use path/ difference to 'cut' out the inner shape from the outer shape.

Lano

@jckmcgraw

Hmmm... i think you should consider these steps to export your object to PNG images in the future:

1. select all objects you want to save;
2. menu File > Export Bitmap;
3. from here, you can export whatever you name it.

It will automatically save your images in PNG format with transparent background.

Cheers!

SpriteAttack

@jckmcgraw - I see - completely different problem... and @Lano is right the easiest way is via export bitmap - I would however add a transparent box behind the letters that covers the size of the widest/ highest letters (e.g. W or M) and export all characters with that image selected as well (and turn on the "Selection" tap in the export ). That way you get letters that are a common size and make placing easier - ideally with a bit of code to shift letters like 'i' closer to their neighbors.

Lano

@SpriteAttack

Absolutely right! to ensure consistency in image size and position of object inside it, normally i use this technique i.e. adding transparent box at the back of the object... before exporting to PNG image.

Cheers!

mrglockling

If I remeber right from a post I saw earlier you can save it as a .bmp and do something else but im not sure I prefer illustrator

jckmcgraw

@Lano

Ah ha! Thank you very much!

Regards,
Jack McGraw

jckmcgraw

@Lano

After really getting onto my computer and looking at your solution, it looks like it won't fix the problem I am having. When you use the difference with the shape inside, it won't neseccarily make it transparent, which is what I need (correct me if I'm wrong). Additionally, it wouldn't be reasonable to go into every single letter and make a shape that fits if your solution does in fact work.

I suppose I'll have to do some more searching. Thanks for the idea though!

Regards,
Jack McGraw

jckmcgraw

@SpriteAttack

I suppose I didn't make myself clear at all! #-o All I meant when I said custom font was a non-GS font. I'm just typing up all of the text I need in Inkscape, and am saving it as a .png file.

How can I make that background layer transparent in Inkscape? Before putting text in images, I would use Preview's "instant alpha" feature to highlight the background, and then delete it. It would be a pain to do that to every single letter that is closed off.

Thanks for putting up with my ill-prepared explanation of my question.

Jack

jckmcgraw

@Lano

I'll give it a go in the morning! Thanks!

Jack

jckmcgraw

@SpriteAttack & @Lano,

Sorry for the late response to your solutions, but I am so new to Inkscape that I don't even know how to make a transparent box.

Thanks again for all of your help,
Jack McGraw