Sarah (maidofawesome) wrote in graphics_school,

  • Mood:
  • Music:

Lesson 5: Fill Layers and Colour

Ok, you guys are so lucky. Well, assuming you love me and this community, and if not, why are you here? Well, anyway, my internets is down, which is making me so crazy because I CAN'T READ MY EMAIL. I might have important stuff in there! Like.... I actually want a joke here, but I can't think of anything funny, because there are genuinely important emails I could be missing, because I'm job-hunting, and... oh right, you don't care.

Anyway, I was going to jump straight into text. And then I was writing about text and I had to keep explaining things that I hadn't explained yet and it made sense to do a lesson before text with things like fill layers, because although they're way simple, for some reason they take a long time to explain. It might be the way that I explain things. I talk a lot. It's a whole thing.

So, this is how to make a fill layer.

Open/make a base:

Now make a new layer above it. I showed you how to do that already, right? (Layer-->New-->Layer) Your Layer Palette:

Select your newest layer on the layer palette and fill it with a colour. To do this, first click the fill tool, which is here on your tools list:

(if you have this symbol: in that place instead of the fill symbol, you need to right click on it, and change the tool from gradient to fill )

Ok! Now select a colour. At the bottom of your tools list, go to this little symbol:

Don't click it yet, cos I want to explain thingies.

Oh, I should mention that if your Photoshop is on default, these squares will be black and white. Mine are red and white because I used red to point at stuff in earlier screenshots. The top layer (in this case, red) is your foreground colour, the bottom layer (white) is your background layer. You can change these over by clicking the little double edged arrow above them, here:

Click it a few times, and see, they change back and forth. This is good for when you're working on something with a couple of different colours, and you don't want to keep resetting them. Oh - to reset them back to default (black/white) click the little miniature version of the tool, below the main colour tool. This:

Ok! Woo. Now you can click the colour symbol (foreground, please) and this should pop up:

Pretty! Pretty! Ok, I'm going to label this up, because it'll be an easier way to explain it without having to make millions of screencaps and little arrows and stuff. So.

Ok. Yeah, I know there are other boxes but they're not important. I've never, ever used them. Maybe I should, but... I never have, so I don't think they're important.

1 - This is how you can change the shade of a colour. So, in this instance, different shades of red, all the way to pink. Try it - click anywhere in this large box. You'll see that the colour in 3 changes to be that colour. (The colour in 4 is the colour you started with, which is useful if you are working from a colour that you want to contrast with. Also, you can click 4 to go back to the original colour you were working with, too.) It's kind of like, when you are working with paints, and adding blacks and whites to them. Which is why the top left corner is white, and the two bottom corners are black.

2 - Is where you can change the colour that comes up in the large colour palette window. So if you want to choose a shade of blue, for example, you would click on blue in that pretty spectrum of colours. And a little arrow comes up where you have clicked, see:

Damn, screencap, I was trying to resist. But I like 'em! Anyway, does that make sense? You can choose any colour, like pink, and choose a darker or lighter pink, or green, or tuquoise, etc. And if you gradually click up and down the colour spectrum (as I am calling it) you will see how the large colour palette changes - you don't just get one shade of green, you get several - it's the same up and down the spectrum.

I've explained 3 and 4.

5 is nifty. See that weird little code there? The one that says BB2626? It's the code of the colour. Every colour has a code. And it's translatable throughout most image programmes (except the very, very basic ones), and more importantly... on the internet. You can use this code to change the background or image colour on a website (or livejournal layout). It's HTML code. I'm not intending on dealing with web design or layouts, but I will quickly show you how to change the font of something on the web, using said code. Choose any colour. Pink! And look, now my text is that colour. You write it like so:

<font color="#C10674">pink text!</font>

La! Now, the great thing with the colour palette on Photoshop is it's limitless. There is no colour that it can't create. Except octarine, which only exists in Terry Pratchett's books. Now I shall demonstrate. With your palette open, select this tool (the colour dropper tool) on your tools list:

It's actually the only tool you can open with your colour palette open, and it's because you use it a lot with the colour palette. Make sure you can see your base (oh yes, don't forget about your base!) on your window - you can move your colour palette around by clicking the long bar at the top of it and dragging it around (like most computer windows) so you can see your base underneath it. Got it? Ok, now click somewhere on the base, with your little colour-dropper tool.

That's a colour from the darker highlights on Veronica's face. And just click anywhere. Every colour on a photograph can be picked up. Isn't that cool? The thing I use this most for is text - text looks best on an icon when it matches a colour on the image. Also, you can use the colour dropper tool without the colour palette open. When you use it with the palette open, though, you can select a colour from your image, and then if it isn't the right shade, you can then alter it slightly on the colour palette - make it lighter, or darker, etc.

Damn, this is so involved. I thought it was going to take five minutes to show you how to use a fill layer. Well. Um. Pick a colour! And then select the fill tool, select your new layer, click inside it (on the actual image canvas) and lo! It fills!

And that's how to make a fill layer. And also the wonderful world of colour! I was going to deal with blend modes now, but this has got long. Looks like that's next, and text has been bumped from Lesson 5 to Lesson 6. Poor text.

<--- Lesson Four | Lessons Index | Lesson Six -->
  • Post a new comment


    default userpic
    When you submit the form an invisible reCAPTCHA check will be performed.
    You must follow the Privacy Policy and Google Terms of use.
I really hope your internet starts working again, and that you find a job soon!
Oh, and thank you about the text advice. I never realized that it does look better when it matches a colour in the icon. That makes my icons look so much better!