Overlay image/gif with partially transparent layer

Asked Jan 04 '17 at 22:01

Active Jan 04 '17 at 22:04

Viewed 349 times

I want to create something like the following for my react-native project:

So I basically want to have an image or a gif and I want to put a transparent text with a colored background on top of it. In the above seen case, it is transparent text with a white background.

I can't find a way to do it.

Help would be greatly appreciated

asked Jan 04 '17 at 22:01

ViktorG

No need for JavaScript in this case, CSS will do – Pekka Jan 04 '17 at 22:03
See also http://nimbupani.com/using-background-clip-for-text-with-css-fallback.html – Pekka Jan 04 '17 at 22:03
@Pekka웃 I added stuff. It is for a react-native project – ViktorG Jan 04 '17 at 22:04
Well, that changes things. Reopening – Pekka Jan 04 '17 at 22:04
That's going to be more difficult. Best bet IMO would be SVG: http://stackoverflow.com/questions/3796025/fill-svg-path-element-with-a-background-image but no way to do that with dynamic text I think – Pekka Jan 04 '17 at 22:05

Overlay image/gif with partially transparent layer

0 Answers0