hpr-knowledge-base/hpr_transcripts/hpr3210.txt

Episode: 3210
Title: HPR3210: GIMP: Patterns and Gradients
Source: https://hub.hackerpublicradio.org/ccdn.php?filename=/eps/hpr3210/hpr3210.mp3
Transcribed: 2025-10-24 18:54:00

---

This is Hacker Public Radio Episode 3,210 for Friday 20 November 2020. Today's show is entitled,
Gimp Patterns and Gradients. And as part of the series, Gimp, it is hosted by Ahuka
and is about 22 minutes long, and carries a clean flag. The summary is,
Patterns and Gradients are useful for drawing with more than just color.
This episode of HPR is brought to you by AnanasThost.com. Get 15% discount on all shared
hosting with the offer code HPR15, that's HPR15. Better web hosting that's honest and fair at AnanasThost.com.
Hello, this is Ahuka, welcoming you to Hacker Public Radio and another exciting episode
in our Gimp series this time. And what I want to talk about today are Patterns and Gradients.
Now, you're going to find those in the same area as brushes, which we looked at last time,
and that is in the lower right. And I'm assuming that, you know, if you've docked it,
that's the standard place that it would be docked in a single window view.
So, we have tabs down there next to the brushes tab, there's patterns and there's gradients,
and they operate in a very similar way. So, start with patterns.
Patterns are images that are meant to be tiled. Now, if you have as much gray hair as I do,
you may remember that we tiled background images for websites in the early days of the web.
And of course, we would never do that now, would we?
But while tiling is a very common use for patterns, that is not the only use.
A pattern is just an image after all, and you can use it to do things like Bucketville,
Paint with a Clone tool, or Stroke along a path.
Gimp comes with quite a few patterns out of the box, and that's kind of a motley assortment of images.
Now, if you view it on the patterns tab on the bottom right, you have two possible views,
the grid view, which will show four images in each row, and that's okay.
And then there's also List View. The same information is available either way.
So, you take a look at one, you click on it, and you will see the name,
and the dimensions of the image.
So, I selected one to play around with called Topographic Oceans,
because I'm a yes fan, and I saw that. It made me think of the yes album tails from Topographic Oceans.
So, I selected the pattern, and clicked on it.
And when I did that, I take a look at the tab that image is now on the tab itself.
And then under that, there's a drop-down box for filter, and then under that is the name,
and the dimensions of this particular image, and it's a 256 by 256 image. These are all pixels,
of course. And knowing the dimensions of the image can be helpful if you want to use it to
dial a background. And you might want to be fitting a certain image.
So, you know, know how that's going to work. So, if you want to test this out,
what I would suggest you do is that you open GIMP, create a blank canvas, and try doing some
of these things. Now, the other thing I will mention, if you wish, if you take a look at the show notes,
you may or may not know this, depending on how closely you follow what I do. But almost everything
I do on Hacker Public Radio, I first write out on a website, so that I'm working from a script,
basically, when I do the recording of the program. And since a lot of what we're dealing with here
are visual images, you might want to take a look at the show notes and say, okay, what's on that
page? Because I created a whole bunch of images to illustrate the stuff that I'm talking about.
And this particular site, it's a hookah.com, surprise, surprise. But that's only one of three different
websites that I'm maintaining. This is the one for a lot of the software stuff. And by the way,
it's the same site that has all of my Libre office tutorials if you ever wondered where those
things were located. So, anyway, back to the story. I selected the topographic oceans. I opened up
a blank canvas. It was a 640 by 400 in this particular case. And then I went to the tool,
which was Bucket Fill. And in the tool options on the lower right, make sure you've selected
Pattern Fill. No, that's lower left, I'm sorry. Tool options are always at the bottom
underneath the Tools selector. So, on the lower left, make sure you've selected Pattern Fill
instead of foreground FG Color Fill or background BG Color Fill. So, if you select Pattern Fill,
it will fill with the pattern. And then just click on the blank canvas. See, witness the result.
Now Bucket Fill is a tool that we looked at previously as one of the paint tools. I put a link in
the show notes to both the page and the hacker public radio episode in case you want to refer back.
So, in this case, we did a Bucket Fill of an entire rectangular image, which is what you might do
for a background layer. But you can also Bucket Fill a selection, for instance.
In this example, I created a blank canvas and then used the Text tool to write an uppercase letter A.
I made it red when I did that, and then you select by color to select the letter. Now, I could have
just left it as black, but I try and use as many different tools as I can when I'm doing these
things to build familiarity. So, I selected the letter using the select by color tool and then did a Bucket
Bucket Fill on that. And that gave me a letter filled with the same pattern.
I could have used this technique to fill all the letters of a sentence, if I wished, since the
select by color tool will catch everything in a matching color. Now, you can also use the clone tool
with a pattern. That's one of your painting tools. Select the clone tool. It looks like a rubber stamp,
and in the tool options at the bottom, make sure you have selected as your source the pattern.
Now, for this example, I decided to use cashews, which is another one of the built-in
the patterns in Gimp. And then in the tool options for the clone tool, I bumped up the size to 15
pixels on my brush. And the brush, by the way, I selected with a brush 1.Pixel.
Well, if I just left it at one pixel, it's a very thin line, it doesn't really
illustrate anything. So, I bumped it up to 15 pixels and drew a freehand curve, and I can see the
pattern all the way through it. Now, the last option, I will mention here is something called
stroking along a path. Now, we looked at paths previously as one of our miscellaneous tools.
The paths tool let you create Bezier curves, which you can manipulate using the tangent line
handles into getting the shape you want. As we said then, the Bezier curves themselves are vectors,
so they can be resized without any loss of clarity. Stroking along a path means drawing a line,
which can be solid, dashed, dots, or whatever. But if you're filling the line with a raster image,
you cannot resize the stroked line without possible problems. So you should make sure you get the
correct size before adding the pattern. Now, to do this, create a blank canvas and make a path by
clicking once to set an anchor point, then click a second time to add a second anchor point.
A straight line will connect the two anchors. Then, grab any point along that straight line and
pull on it to get a curve you like. Now, I did this, and I had selected an abstract pattern called
Chroma, and so when I had the curve the way I wanted, I just went into the edit menu to select
Stroke Path. One of the things about GIMP that you just have to get used to is where is everything
located. Now, we've got something we want to use the path tool, we want to stroke along it,
but now we've got to go to the edit menu to find it. When you do, it'll bring up a dialog
box, choose Stroke Style, and where it says Stroke Line, you've got options like Solid Color or
Pattern, so I selected Pattern. Now, note that instead of a solid color, I've selected Pattern, but
the default width here of six pixels is a bit small, so I'll again increase it to 15 pixels,
and then just click the Stroke button, and I had it. Now, the patterns we have all looked at so far
are ones that come with GIMP, they're built in, but you can always create your own as well.
There are two places GIMP will look for Patterns. The GIMP System folder, which is where the built-in
patterns are located, and the user folder. You should not attempt to mess with the System folder.
If you want to add a pattern, it should go into the user folder. Now, just where this folder is
located will depend on your operating system. GIMP is widely available on many operating systems,
but for example, on my System, which is a Kabuntu 18.04, in case you're wondering.
In my System, it is in the slash home, slash user slash dot GIMP dash 2.8, so I'm using GIMP 2.8,
the dot in front of the GIMP dash 2.8 means it's a hidden directory, and that ends up meeting
something. There's all of the other user folders in there for brushes, pallets, gradients,
you know, whatever. Now, remember a pattern is nothing more than a rasterized image,
so you can create one using GIMP itself. When you have it the way you want,
you need to export the file and give it a dot PAT extension.
Now, on my Linux box, I did not have the option of saving directly to the patterns folder,
and the reason is it's a hidden folder. As I mentioned, it's in a hidden directory.
So what I did is I exported it to the temp directory and then just use my file manager to copy
it over to the patterns folder. Now, once it's there, go back to the patterns tab on the bottom
right, and then at the very bottom, there is a refresh button. You click the refresh,
and your pattern will be added, and you can then use it like any other pattern.
If you no longer need it, you can click the trash icon to delete it,
but note that you cannot delete the built-in ones in the System folder.
All right, so we've covered some of the uses of patterns,
and that brings us to gradients, the other tab on the bottom right,
and it works much like the other tabs, brushes and patterns that we've already talked about.
If you view it as a list, it'll have a display of the actual gradient on the left next to it the name.
So I went down and I selected a gradient to S with,
and the gradient I selected is called incandescent. Now, as with patterns and with brushes,
GIMP comes with a set of gradients that are built in, which you can use, and they're displayed in
the selector box. You can apply a gradient using the Blend tool. It's another one of the paint
tools that we're using here. When using this tool, what you need to do is you draw a line that
connects a starting anchor point to an ending anchor point, and you do it by clicking once for the
first anchor, and then click a second time for the second anchor. And that line is how the gradient
will display. So I did an example. I created a sample image and clicked once on the left and
once on the right and drew a horizontal line, and I got a gradient that moves from left to right.
Then I did another sample, and this time clicked once on the top to start and once on the bottom
to get a vertical line. And then the third variant I did was one where I clicked in the upper left
corner to start in the upper right corner, and then in the lower right corner to finish,
and that gave me a diagonal line. And so now the gradient works as a diagonal.
So what we've done so far, these are fine for backgrounds, but you can use gradients with other
tools like pencil, paintbrush, and airbrush. In each case the process is similar. You select the tool,
then looking tool options on the lower left, and in tool options look for a selection called Dynamics.
Click the button to the left of that word, and that brings a pop up with a whole list of options,
and you want to find that says color from gradient. Then select the brush you want to use from
the brushes selector box on the right. So I did this. I used the same incandescent gradient,
the paintbrush tool, and for the brush I used the 2.hardness 050 brush.
And just did a freehand drawing, just a kind of a wavy line here.
So it's kind of a brush stroke. Now with patterns we saw we could fill text. We can do it the same way
here with gradients. So we just open up a blank canvas or whatever, use the text tool to create some
text. And if you want to see this you want to make sure the text is large and bold so that you've
got something to work with here. And then what you do is using the blends tool, you draw a line,
and the gradient will follow that line, and that line will just go through all of the text.
And so I did it with a horizontal line, so my gradient runs from left to right across the text.
Now finally you can also use a gradient to stroke along a path, just as we did with the patterns.
So you create a path using the paths tool, then select a drawing tool like the paintbrush,
and make sure the color from gradient has been selected as we did above, then to the edit menu
and select stroke path. So I did an example of that. Now I've kind of combined patterns and gradients
in this tutorial because the tools are really very similar to use. So techniques you use with one
work as well on the other, as you can see. Now also as with patterns you can make your own.
You're not restricted to just the gradients to come with Gimp. Here is a user folder for the ones
you create. And while you cannot modify the built-in gradients, you can copy them and edit the copies.
Look at the bottom of the gradient selector box and you will see buttons to edit, create new,
copy, delete, and refresh. So if you want to modify a gradient, just copy it first, then edit the copy.
And when you do this you'll get the gradient editor on the top right.
And that's going to show you the gradient and then at the bottom you're going to see some triangles.
And these triangles you can click and drag to move around. And what they do is they modify the
transition points between colors in the gradient. Now if you're editing an existing one you will
simply see the existing colors. But suppose you wanted to change one of those existing colors.
Well if you right-click on the gradient as it is in the editor, a pop-up menu appears.
And what that does is that lets you edit the different colors. So you'll see a space for the left
endpoint color, a space for the right endpoint color. And if you click on the little boxes that
have the color, that'll bring up your usual color palette dialog box where you can select a
different color if you wish. Just double-click on a point in the dialog box and that'll change
the color on the gradient. If you want to create a new gradient, that's very similar. When you click
to create a new gradient button, the gradient editor will give you a grayscale gradient to start with.
Then right-click on this to bring up the pop-up box and make your selection as usual.
Now whether you've created a new one or modifying an existing one, saving is the same either way.
Give it a name in the box on top of the gradient editor. Then click the save icon on the bottom left
of the editor. Now to see it in your selector box on the bottom, click the refresh button and it
will appear. And when you no longer need it, you can use the delete button on the bottom of the
selector. Just remember, you cannot delete the built-in gradients, just the ones you created.
Now the other thing we did in this tutorial is to combine tools. If you think about it,
we make to make use of these techniques, we combine the use of painting tools, the path tool,
the color select tool, brushes, and combine all of them to work with patterns and gradients.
And that is really how an application like GIMP is meant to be used. So while we started off slowly
looking at specific tools in isolation, as we go forward, we will be pulling tools left and
right to achieve the results we want. Still, getting familiar with each of the tools individually
is important in building confidence in using them. So my suggestion is the best way to use a
tutorial like this is maybe first take a look at some of the examples that I did from my website,
link in the show notes, open up the GIMP, start creating images. All right, open up blank canvases,
start pulling the tools. And you know, if you follow along with my website, you can see how I did it
and doing that is not going to make you the world's foremost authority on this because I'm not
the world's foremost authority. I'm just the guy who's telling you what I'm learning.
But I think doing that is really going to help you feel a lot more comfortable working with GIMP.
So with that, this is Ahuka for Hacker Public Radio signing off and reminding you to support free
software. Bye-bye.
You've been listening to Hacker Public Radio at Hacker Public Radio. We are a community podcast
network that releases shows every weekday Monday through Friday. Today's show, like all our shows,
was contributed by an HBR listener like yourself. If you ever thought of recording a podcast,
then click on our contributing to find out how easy it really is. Hacker Public Radio was founded
by the digital dog pound and the infonomican computer club and is part of the binary revolution
at binrev.com. If you have comments on today's show, please email the host directly, leave a comment
on the website or record a follow-up episode yourself. Unless otherwise status, today's show is
released on the creative comments, attribution, share a like, 3.0 license.