Blog Post RSS ?

Blogs » Web Design » Photoshop Tip: Locking Transparent Pixels
 

Photoshop Tip: Locking Transparent Pixels

by Jennifer Farley

If you look on the Layers palette in Photoshop, near the top of the palette, you’ll see the word “Lock” followed by four symbols. From left to right, the icons are Lock Transparent Pixels, Lock Image Pixels, Lock Position and Lock All. Today’s little tip relates to the first button, Lock Transparent Pixel and how you might use it in your work.

LayersPalette

It’s very easy to change a block of color in Photoshop if it has strong, defined edges. You could use the Paint Bucket or Color Replacement tool to change the color, but if you want to change the color of an object that has faded edges or is semi-transparent you need to apply press the “Lock Transparent Pixels” button on the layers palette to do just that.

Here’s an example. Let’s say for example you have some sort of colored shaped with soft edges. Take the green heart shape below. It’s solid on the outside but the inside fades to transparent.

GreenFadedHeart

Now let’s say we wanted to change the heart from green to red using the Paint Bucket. If we click on a green section with the Paint Bucket tool with red as a foreground color, this is what we get.

RedHeart

We’ve lost the faded edge and it looks pretty rough all around.

To deal with this problem, click on the “Lock Transparent Pixels” button near the top of the layers palette in Photoshop. The important thing to remember is that this only works on layers with transparency, it has absolutely no effect if the object is part of the background layer.

LockTransparentPixels

Once the button is press, the transparent pixels are locked and we will only be able to manipulate the opaque parts of the layer. Now when we click on the green heart, the fade to white is preserved.

TransparentPixelsColourChange

This effect is useful for both web and print work.  Have you used it before?

Share and Enjoy:
  • Digg
  • del.icio.us
  • Facebook
  • Google Bookmarks
  • Ping.fm
  • Twitthis

Related posts:

  1. Five Photoshop Layers Speed Tricks Jennifer shows you five quick tricks to speed up your...
  2. Making A Clipping Mask With Text In Photoshop Jennifer shows you how to make a clipping mask using...
  3. Photoshop Web Graphics Tips Jennifer shows you three tips to help speed up your...
  4. Make A Big, Beautiful Call-To-Action Button In Photoshop Yesterday, we looked at some guidelines for creating a call...
  5. How To Quickly & Easily Remove A Background In Photoshop Jennifer takes a look and the often ignored, but very...

This post has 12 responses so far

Sponsored Links

Leave a response

You are not logged in, log in with your SitePoint Forum username and password.

-OR- Post Anonymously

* Make sure any code samples are escaped (i.e. ‘<b>’ becomes ‘&lt;b&gt;’).

If not logged in, your comments will be placed in a moderation queue. This means your comment may not appear until one of our moderators approves it.

SitePoint Marketplace

Buy and sell Websites, templates, domain names, hosting, graphics and more.

Follow SitePoint on...