Rescreatu - Virtual Pet Game

GIMP Text Border Tutorial


Go to page: 1 Bookmark Thread
Kitty

5:21pm Jul 19 2010 (last edited on 2:04pm May 23 2011)

Normal User


Posts: 195

I'm not sure if this belongs here. But I'll proceed anyway.

All right. Amaryllis wanted to know how I make a border around my text in GIMP 2.6, so I'm making a tutorial here for everyone to use. ^^ GIMP 2.6 is a free program that I love using to make graphics. Find it here: http://www.gimp.org/downloads/ 

Step 1: Open a new canvas to put your text on. The size is entirely up to you to decide. Mine is 400x200.

 http://img844.imageshack.us/img844/391/gimp1.png

Step 2: Now that you have your canvas open, create a new la
yer. Make sure it is transparent (default setting). Name it "Text" so you don't get confused.

 http://img826.imageshack.us/img826/4972/gimp2.png

Step 3: Making sure you have the "Text" la
yer selected, add your text. I usually choose a light color first. When we outline it, it'll be a darker color.

 http://img826.imageshack.us/img826/1608/gimp3.png

Step 4: Now, you may notice that the text is just floating there. The next thing to do is to merge it down onto the "Text" la
yer.

 http://img839.imageshack.us/img839/5695/forgottenimage.png

Step 5: You will need to select your text now. What I do is right click on the "Text" la
yer, and choose Alpha to Selection.

http://img844.imageshack.us/img844/4029/gimp4.png

Step 6: This step lets you choose how thick you want your outline/border to be. Look for Select at the top and click Grow. I usually stick between 1px-3px. I'm using 2px in this tutorial. Feel free to experiment with it.

http://img835.imageshack.us/img835/6007/gimp5.png

Step 7: It's time to make a new la
yer named "Outline" or "Border." I chose "Outline." Make sure it is transparent like last time. You will have to drag it underneath the "Text" la
yer. Refer to my screenshot to see how this looks.

http://img839.imageshack.us/img839/790/gimp6.png

Step 8: Choose the color you want the border to be. Select the bucket tool. Make sure the "Outline" la
yer is selected. Click anywhere on the text to make the outline.

http://img842.imageshack.us/img842/6048/gimp7.png

Step 9: Find Select at the top, and click None.

 http://img830.imageshack.us/img830/6200/gimp8.png

Step 10 (if it's needed): Here's the bad news. Sometimes fancier fonts aren't completely outlined. They'll look like they're faded. You'll have to zoom in and fix the problem using a small brush.

http://img836.imageshack.us/img836/2208/gimp9.png

Step 11 (optional): If you want to make the text have a transparent background, just delete the "Background" la
yer.

Before: http://img828.imageshack.us/img828/6594/gimp10.png

After: http://img826.imageshack.us/img826/2545/gimp11.png

Here's the finished product:

If you need additional help or have any questions, feel free to send me a message. I won't be checking this thread very much. And please be patient. I'm not always online. I hope this was helpful to at least one person. ;D




Something will be here eventually.
Amaryllis

12:57pm Jul 20 2010

Normal User


Posts: 649
Thank you, <33 It worked! :D



ohaithar.
Kitty

2:44pm Jul 20 2010

Normal User


Posts: 195
I'm glad. You can use it for your banners. <3



Something will be here eventually.
Phos

5:37am Aug 4 2010

Normal User


Posts: 1,326
i love you OuO






Lycan

11:38pm Aug 5 2010

Content Manager


Posts: 3,132

-flails-

This would be helpful if I had GIMP. XD;

But I'll keep this tutorial in mind if I ever do decide to download it.




Kitty

5:17pm Nov 8 2010

Normal User


Posts: 195
Bump ya up. P:



Something will be here eventually.
 _Ranvier

6:51pm Nov 8 2010

Normal User


Posts: 1,731
Love thissssss. <333




Go to page: 1