The background color of my website is a light gray. I have a stock image with a white background that I would like to blend with my background. So I picked a small rectangle of the background and pasted it as a new layer in Photoshop. Then I added a Brightness/Contrast adjustment layer to the stock image below. I moved the brightness slider until the small rectangle disappeared, meaning the colors should match, I should think.
But when I add the image to my site there's still a discrepancy; the stock image background is too dark.

What's the best way to adjust the stock image's background so that it matches my site's background?

1 Answer 1

  • Copy the Hex or RGB color value from the web site CSS file.
  • Set Photoshop's Foreground Color to that Hex/RGB value
  • Create a New Layer above the stock image
  • Fill the new layer with the foreground color (Edit > Fill)
  • Set the Blend mode of this filled layer to Darken
  • If necessary, create a Layer Mask on the fill layer and mask (paint) away any areas which got darker and weren't desired.
  • File > Save for Web...
  • Ah, that makes sense. It didn't work rightaway though, but that was my mistake and the reason my solution didn't work either: my "gray" had a little bit of blue in it (#e9eaee), and the stock image I started from was in grayscale mode. After converting to RGB it worked fine. +1, thanks a bunch.
    – stevenvh
    Commented Sep 21, 2013 at 11:39

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.