Colors, Gradients, Patterns and Textures - Beginning Level
While working on any of the tutorials, should you have any problems or questions, just send us
an email.
Please do not make copies (electronic or paper/hard) of this tutorial or use it without
permission.
You may print one hard copy for the use of you and your immediate family.
Your finished product is your own to do with as you please.
This is an introduction to using colors, gradients, patterns and textures in Paint Shop Pro.
It is designed for beginners and has some repeat information for reinforcement.
You should already know how to open a new image, add a new raster layer, and rename a layer.
If you do not know how to do this, refer to the tutorial, Introduction
to Layers and Opacity.
This tutorial will show you how to select colors, gradients, patterns and textures, as well as
how to save a swatch and select a swatch.
This tutorial does not get into creating gradients, patterns, and textures.
That is in other lessons.
This tutorial does not include how to make gradients or patterns.
That is covered in other tutorials.
This is to show you how to select colors, including "custom" colors, gradients, and patterns.
It will also help you see how textures work.
I used Paint Shop Pro 9 for this tutorial, however, you should be able to use other versions as
well.
For a free trial or to purchase Paint Shop Pro, click on the above link.
Step 1
Open a new transparent image with the following settings:
- Width and Height 5 inches (make sure inches is selected)
- Resolution 72 pixels per inch
- Raster background
- Color resolution 16 million colors (24 bit)
- Transparent checked
If you use these same settings, you will see the same as the examples shown in this tutorial.
Remember, those gray and white checks show transparency.
You should see them clearly, because there is nothing else to see, it's totally transparent.
Step 2
Right now we are going to add a new layer.
This layer will also be transparent, but we will be putting something on it in a bit.
Click on "New Raster Layer" in your Layer Palette.
A window will pop up for you to fill in any settings you wish to include in this new raster layer.
You will see the layer name, "Raster 2".
We will leave it named this as we are just "playing around" in this lesson, however, naming each of
your layers helps keep everything organized.
If you name them properly, you'll be able to tell what is on each one easily.
The other settings should be ok, but double check them anyway:
- Blend mode should be normal
- Opacity should be 100
- Link set should be 0
- Layer is visible should be checked
Step 3
It is now a good time to save your file.
It is good practice to save your file often.
To save your file, click on the diskette icon, or use from your menu, File, Save, or even Ctrl-S.
In all cases, a window will pop up prompting you for a file name.
Enter in your file name.
It is important to save as a Paint Shop Pro Image, because it will save all your layer information
with it.
Click the Save button when ready.
Step 4
Now we'll get to adding something to our image!
You should still have your Raster 2 layer active (highlighted in your Layer Palette.)
If it isn't, click on that layer in your Layer Palette to make it active.
Now we will choose a color to put on this layer.
We will be using the Materials Palette for this.
The Materials Palette is on the right side of the Paint Shop Pro window, near the top:
Yours may not look exactly like this one, but the big give-away are the two color boxes on the right
side, where the arrows are pointing.
The top one, where the yellow arrow is pointing, is for your foreground.
The bottom one, where the red arrow is pointing, is for your background.
These can be solid colors, a gradient, or a pattern.
The smaller boxes can also be used, but only for the color, not a gradient, pattern, or texture.
We'll get into that part a bit later.
To change your foreground, click on the foreground box in your Materials Palette.
A window will pop up to change the color. It will look similar to this:
Make sure the Color tab is active and click on it if it isn't.
To choose a color shown, just click on it.
If you select the color pointed out by the red arrow, you will notice the "Current" color
(yellow arrow) changes to that color.
This "Current" box will show you what the properties chosen for your foreground will look like
(for example, if you selected a texture.)
The same applies for your background, when you select your background box.
But there are so few colors to choose here, and so many colors available.
To use more colors, there are several options.
One is to click and drag the two circles, pointed out by the pink and green arrows, until you get
the color you want.
This can take some time, but may be the only option if you don't know the exact color you want.
Another option is to enter the RGB (Red, Green, Blue) values of the color, that is, if you know
them.
This area is pointed out by the blue arrow.
Enter the red value in the R box, the green value in the G box, and the blue value in the Blue box.
Next to the RGB values, is the HSL (Hue, Saturation, Lightness.)
This is a bit more difficult right now, so we won't work on it in this tutorial.
Then there is the HTML box under the HSL area.
This is where you can enter the color value as you would in an HTML document.
It always starts with a '#' followed by six numbers, three groups of two.
It's easy to just copy and paste this number into the area there.
Why don't you give it a try?
Copy this HTML color value: #e7cfd5 and place it into your HTML box.
Did you come up with the following?
We will go ahead and select a texture.
Check the Texture box and then find the texture named "Backdrop" and select it.
You will notice your Current box will look different and show some type of transparency:
Click the OK button and your foreground will be changed.
Flood fill (paint bucket icon) your Raster 2 Layer with your new foreground.
Save your file.
Step 5
Let's select a color to place on your Raster 1 layer.
Click on your background box to change it.
Change the color to this HTML value: #b36163.
Flood fill Raster 1 with your background color (remember to select your Raster 1 layer and to right
click to use your background to flood fill.)
You should have something like this:
Save your file.
While you may not really want to save this file, it is an important thing to remember to do just
in case something happens along the way.
So, get used to saving your work often.
Step 6
Ok, let's say you really like the foreground color/texture combination.
Let's say you also like that background color and don't want to forget it.
Well, we can save these for future use quite easily.
In your Materials Palette, you will notice tabs.
The third one (see red arrow below) is the Swatches tab.
Once you select that tab, you'll see any swatches you have saved.
PSP comes with some already.
To save your foreground as a swatch, you can click on the "Create New Swatch" icon (see blue arrow
below.)
After you click on it, a small window will come up asking you to give the swatch a name.
Go ahead and name it.
The Materials Property window will then come up.
If you want to make any changes, go ahead.
When it's just as you want, you can click the OK button and it will show up in your Swatches.
Another way to save one is by bringing up the Material Properties window (by clicking on either
the foreground or background selection in your Materials Palette.)
Near the bottom right of the Material Properties window you will see a button, "Add to swatches..."
If you click on this, it will ask you for a name to save it as.
Once you name it and click OK, it will be saved in your swatches.
How do you get these to your foreground and background color?
Just click on the swatch you want and it becomes your new foreground.
To make one your background, right click on the one you want.
It's that easy!
If you are already in your Material Properties window, you'll be able to pull them up by clicking
on the button shown by the blue arrow below:
Just select the one you want. Go ahead and try one.
We'll get into a few other ways to select colors in later tutorials.
Step 7
What about selecting a gradient or pattern?
Since you already know how to change the colors, you'll see it's quite easy to select a gradient or
pattern.
We'll change the foreground.
Click on the foreground box to open the Material Properties window.
You'll see three tabs on the top left of the window: Color, Gradient, and Pattern.
We'll select the Gradient tab first.
Select the little triangle next to the Gradient box (see red arrow below.)
You'll then see a lot of gradient samples.
Some of them have transparency attributes.
Find the "Raindrop" gradient and select it.
The blue arrow, in the above, is pointing to one of the gradient styles called Linear.
There are also Rectangular, Sunburst, and Radial.
You'll also notice an area for Angle and Repeats.
Angle, which can be changed by entering a number for the angle degree or by moving the "dial" in the
gradient box.
The Repeats will change how often the gradient will repeat itself.
On Rectangular, Sunburst, and Radial you can also change the center point.
Sunburst does not have the angle feature.
Go ahead and try a few to see how they look.
Just playing around with this will help you learn more how it works.
Add a new layer (Raster 3) and flood fill it with the selected gradient to see what happens.
Save your file.
Step 8
Patterns are very similar.
Just select the Patterns tab instead.
You can select any pattern just as you did a gradient.
You can also change the angle of the pattern just as you did the gradient.
Patterns have another option, too, called Scale.
This will allow you to reduce or increase the pattern size.
Just enter a number, which translates to a percentage (10-250) of the original.
Just know that sometimes it will change the look of the pattern if you change it too much.
Go ahead and select a pattern and try it out on a new layer.
Save your file.
Step 9
You can use textures on Colors, Gradients, and even Patterns to give a different look.
Textures also have the Angle option to change the direction of the texture, and the Scale option to
change the size of the texture.
Remember, when playing around, if you create anything you want to save for the future, include it
in your swatches.
You can save swatches with or without textures, in Color, Gradient, or Pattern.
I wanted to mention one other little trick for selecting a recently used swatch (even if it isn't
saved.)
If you right click on the foreground or background area, a window with recently used materials will
pop up.
Just select the one you want.
Assignment: Play, play, play. You need to do this to get familiar with it how it all works.
|