Participating Frequently

질문

How do I fade the edge of a picture into the background?

Forum|Forum|12 years ago
February 23, 2014
2 답변들
25438 조회

I am using the trial of PhotoShop and am learning web design. I would like to know how to fade the edges of a picture so that they gracefully transition to the background color. Allow me to illustrate:

Here is a stock photo of a kind man I purchased online and as you can see, he's sitting on top of a light blue background of my web page:

I want to provide a smoother color transition at the horizontal edges, maybe near his right elbow and left hand so that the color transitions more gradually into the background. To see what I'm trying to accomplish, navigate to http://unBounce.com and scroll down to the third band where you see an Asian man explaining something. See how the horizontal edges nicely blend into the blue background? That's what I'm trying to accomplish. I realize that the Asian photo is doing some other sophisticated and cool things like blurring the background. I don't need anything that fancy. I just want to have better edge transition via blurring or some other technique.

Sorry for the rudimentary nature of this question. Thanks!

이 주제는 답변이 닫혔습니다.

G

gooberHead작성자

Participating Frequently

Thanks so much for the help, everyone. It's much appreciated!

The approach I ended up using was:

If you take the raw picture of the man as originally downloaded from Shutterstock, you can create a background layer with the color #e8f5ff and let the picture layer sit on top of it. Then, with the picture layer selected, you can set the foreground color to #e8f5ff and choose the gradient tool -- placing it in the mode of "foreground to transparent." On the left edge I create the gradient by dragging to the right and on the right edge I create the gradient by dragging left.

What you end up with is this:

You can see that as opposed to the version of the picture in my original post, the image fits nicely on my web site's #e8f5ff background.

Thanks again for pointing me in the right direction!

Noel Carboni

Legend

That's a nice presentation - good job.

-Noel

Trevor.Dennis

Community Expert

Reminds me of 'Back to the Future' where people faded out of a photograph when history was changed. But I guess even Chuck's method in post #1 is easier than building a time machine. I mean where would you even get the DeLorean

from noawadays?

Chuck Uebele

Community Expert

To fade the edged, you need to make your original file able to have transparency.

holding the alt/opt key, double click on the thumbnail of the background layer to change it to a regular layer.

Add a layer mask by clicking on the mask icon in the layer's pallet.

Set your foreground color to white and you background color to black.

Select the gradient tool and use the foregound to background , and choold linear gradient. Also set the tools blend mode to multiply.

select a distance into your image to start the gradient and then drag out to the edge holding down the shift key. Do the same on the other side.

save your file for web using png-24.

G

gooberHead작성자

Participating Frequently

looks like I've got my work cut out for me. I'll give it a whirl (that's just an expression). Thanks for taking the time to read my question.

Trevor.Dennis

Community Expert

If you follow the above one step at a time, it honestly isn't that complicated. I tried to think of an easier way though.

So you see here the backgound layer has the light blue colour, and the stock image of the mab is on the layer above.

If you Ctrl (Cmd) click Layer 2 to load it as a selection, and then click on the Layer mask icon (third from left at bottom of Layers panel) you will have a layer mask that looks the image above.

Now select the paint brush, and with Black as the foreground colour, a size of about 50 pixels and Hardness set to 0%, draw down each side of the black/white intersection in the layer mask. Hold down the Shift key to force the brush to a vertical straight line.

You need to have less than half the brush width intrude into the white of the mask.

Note: The layer mask should have a thick white line round it (as above). Otherwise you will paint on the image itself.

Good luck.

가입하기

소셜 로그인

커뮤니티에 로그인

소셜 로그인

파일을 바이러스 검사 중입니다.

이 파일은 다운로드할 수 없습니다