- copy your image (
Ctrl+A
andCtrl+C
) - make a new document-sized pure-black layer behind it
- group the black layer and yor image together
- add mask to the group
- enter mask edit mode (
alt+click
on the mask icon/thumbnail) - paste your image in the mask (b/w) and then invert it.
- save it as a 24-bit transparent PNG
-
-
Save magicznyleszek/178576519be1ea9e36cd to your computer and use it in GitHub Desktop.
@rtpHarry because mainly programmers face this issue when a design is given in Photoshop XD
Great tutorial. Just a note, I could only get this to work if I hid the original layer.
Yes.
Aha!
Awesome, man. Worked like a charm. Thanks for sharing.
Thanks, helped out a lot.
I've been looking for this for days! Thank you
You should get paid for this !! Thank you !
Worked perfectly !
Thanks, awesome!
This is great!! Thank you!!!
Curious as to what types of images you would normally do this with? Icons and things? Would you use this technique on photos?
I've seen this tutorial in other places, but it was far more convoluted. This is perfect. You have made my afternoon. Thanks.
@zenbug one application is if you have an image cut out of the background, for instance, an image of a piping hot mug of well-deserved coffee for @magicznyleszek, and that coffee was dropping the perfect shadow and you wanted to put a colored div behind that coffee mug and have it blend magically.
Hi All.
I am trying to follow this, but perhaps I am missing a trick as everyone here seems to have this working perfectly.
I have an image on a white background that was taken in a photo booth. This has a particularly nice shadow that I would like to retain on a PNG, while removing the white background. Colour replace is not working as effectively as a multiply blending option, so this guide seems perfect.
However, I copy the images with the blended layer and the original, to a new document with a black background, then perform step 2 to 5, but upon ALT clicking the mask I cannot seem to past the image in the mask b/w and then invert. Nothing happens when I paste.
Can anyone suggest what I might be missing?
Here is a file that I am trying to do this to, but I am looking for the method, not just the result. I am so sorry if I come off as a little slow here.
@ALL OMG I only today noticed people are using this :) I need to turn on my notifications.
@lewisisonfire I think this is not for you. What you're trying to accomplish is a bit different. This instructions are for a photoshop file with a complex transparent group of objects that you need to export as a single usable png
. What you are looking for is cutting out objects with their shadows from a white background. It will take quite a lot of manual work unfortunately. I would do something similar to this YT video https://www.youtube.com/watch?v=zakUq2BTQDQ
@magicznleszek, I ended up using this and a similar method using an inverted version and pasting into a solid black later mask. Worked out perfectly, so thank you so much for taking the time to respond.
Wow, I just needed to do this and this was really useful, thanks!
Wohoo! Thank you!
This tip worked for me like that;
- ..... done but wont work
- ..... done but wont work
- ..... done but wont work
...
All done lets refresh the page
OMFG!!!!! ITS WORKED ! Kisses!
Great. Thanks
I can't believe this tip is only found tucked away in a gist on a programming website!