how
to have webkit mask image on your scrollbox (any image!)
pastebin code (https://pastebin.com/nQPhn8yT)
1.
download any png image on google! you can make one in an editing app and download it as .PNG
type it in the search box > click images > click tools > click color and choose transparent for fast results then download
2.
make sure the shape you're downloading is in a type of .PNG when the download is prompted.
3.
make sure the shape is cropped as a full, crop it if needed.
4.
you can choose to select imgur to dump the image if you do not have discord to do the discord method!
imgur method
- open https://imgur.com/ on your browser.
- click
new post
upper screen with green button
- upload the .PNG image
- add post title > right click ON the image and copy image address.
- happy pasting it in the style > class > -webkit-mask-image:url(LINK);
discord method
- open https://discord.com/ on your browser.
- i personally recommend you to create your own server OR a convo with anyone > upload the PNG image
i mean creating your own server helps to dump the images and keep track of them
click the +
symbol and upload a file
select the png image file
- now you've uploaded and sent it, click on the image for full view
and right click on the image to copy image address
- happy pasting it in the -webkit-mask-image:url(LINK);
5
now, you need a chatbox, get them on https://cbox.ws/
enter your valid email address, even if its outlook, gmail, yahoo, so on and so for
fill out everything needed
choose cbox free
once you're in this page, click get your cbox embed code
that is underlined
click copy to clipboard
6.
paste the CBOX iframe src link right after closing tag of style
then add class inside the iframe src code; use the code as reference of what to do
outcome:
https://jsbin.com/yehiripola/1/edit?html,output