Step 4: Appying a Gradient in Photoshop

The light-blue text color of the word "Learn" is too close to the base color to see well. One solution is to have a darker color behind that text. Instead of have a solid base color (which is a bit dull anyways), we will apply a gradient to the base color with the darker shade on the left where the word "Learn" is located. The color will transition back to a lighter shade of our base color.

Use a linear gradient...

For the color of the left color stop in the Gradient editor, we input in our inital base color of #E6EEF7 and from there picked a darker shade of blue. As shown ...

Another technique for the left color stop is to simply make it the same color as our dark blue text color of #22648E.

Set the right color stop to our base color of #E6EEF7. And click OK to the Gradient Editor.

Select the "base" layer in the Layers panel and drag out our gradient with the gradient tool.

See how the word "Learn" stands out well against the dark blue now.

When there is a gradient, our eyes tend to move from the dark shade to the light shade. It works out perfect because our dark shade is at the left edge drawing our eyes to the center where the light shade is.

Step 5: Reposition the Text

Since the text position and the gradient is important, let's check if this is exactly where we want the text. The text appears to be at the right height; we left room underneath it for the tagline. Since we want some more room on the right side of the masthead for some links, select the text layer and move the text a bit more to the left.

Make sure you select back to the "base" layer and save your work at this time. You will see why later.

Next

However, the color of the text "Online.com" is still too close to the base color -- rendering the text to be unreadable. What can we do to remedy this? Go to Next Lesson.