Learn how to achieve Knockout text effect or image masking in Elementor heading widget which basically lets you see the background image through your text.
Get Elementor Pro:
https://bit.ly/designelementorpro
This CSS effect can be used to produce some stunning text designs which don’t require photoshop or graphics software but just using Elementor.
Elementor background gradient tutorial:
Custom CSS with Elementor free version:
Join the Facebook Group: https://www.facebook.com/groups/designschoolwp
CSS background property: https://developer.mozilla.org/en-US/docs/Web/CSS/background
CSS CODE showed in the video[FOR IMAGE]:
selector .elementor-heading-title
{
background: url(“ImageURL”) blue repeat 30% 70% ;
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
CSS CODE showed in the video[FOR Gradient]:
selector .elementor-heading-title
{
background: linear-gradient(90deg,red,blue,black) ;
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
source