 What's up everyone? All right. I got another elementary trick and this one This one's going to be super easy that anybody could do and that's going to be adding a gradient to your text and titles But we are not going to use another element or add on or any additional plugins because for me I personally try not to use add-ons if I don't need them I don't want to add extra plugins for something. That's very simple to do and making your titles and text gradient It is very simple. Anybody could do it. Just follow along. There is a very small snippet of CSS All we got to do is copy and paste that over and I'll show you where to make your edits and changes That way you can make your gradient titles look really dope. All right So let's dive into Elementor and have some fun So here's a title that we're going to use I'm going to make this title gradient for this tutorial The first thing we want to do is let's grab the snippet of CSS Now you could find a link inside the description that'll take you to the CSS And all you got to do is copy and paste this over for this tutorial I'm going to place my CSS inside the customize I like to keep my CSS here when I am in development and making changes to the website Because it doesn't get cached and it's easy to edit and I could always see my results right away So let's copy and paste that over now for this It's going to work on any heading text in every paragraph So if you are using a heading widget or text widget, it is going to work now Let's go ahead and publish this Let's go back over to our home Now the first thing we want to do is we want to go to the element that we're going to make gradient So we're going to click on our heading and then go over to advance right here And all we need to do now is put in our CSS class So let's go back over here to our customize to our CSS Our class is going to be this right here the G dash text dash one Now there's a reason why I labeled it this way and I'll show you that in a little bit later So all we got to do is copy and paste this over Make sure not to add this decimal right here You don't want that when you put it inside your CSS classes Just this part right here the G text dash one So we copy and paste out right inside here Let's go ahead hit hit update right here and I'm going to refresh the page Same thing here I'm going to refresh the page so that way we can see our changes And now we can see it's gradient Let me go over here to our CSS and I want to show you exactly how this is working Now if we go here, this is all of our classes is targeting all the text You don't want to change this just leave it as it is That way you could take this class and you could put it on any heading Or text widget throughout your site What we are going to edit is going to be right here The color hex codes so this is how you are going to change your color codes And make it fit more the style of your website You get super creative right here And the only other thing we're going to want to edit is going to be right here Where it says 120 the DEG which stands for degrees So this is the rotation So let's say we put this at zero You can see that it changed things We got this yellow color going to the green right here Let's say we put it at 90 that's 90 degrees So that way we got the green is going, you know, vertically it's going down up and down And if we say we do 180 Oops. Yeah 180 Now it's going more at an angle So you would only play with this number right here to change the angle of the gradient and rotate it And all you got to do is make sure that you leave it just like this only change the text Don't put a space right here and to make sure that we keep the commas right here So you're only going to edit this now I want to show you something really cool Very helpful a tool that I use and that is a CSS gradient generator So right here we could actually play around with the CSS That's how I got the CSS or the color codes I should say for the gradient that I use so you could click on this and You could change it around and see it working in real life So if I want to use a gradient like this and you can see how it looks Then you could take the color codes right here and all you got to do is edit them right inside here and That's it. It's that easy. It's super easy to do You don't need an additional widget or a plugin in order to create this effect And you're going to keep your websites a whole lot lighter Now what I like to do when I'm building my site is I like to create about three or four different styles I don't want to just be stuck with one So what you could do is right here you could copy and paste this whole section I'm going to create two of them and then you could just go through each one of these and let's change them to two And then the next one you could change to three and now we have three different ones here So we have one set up here that we could use for this style in this color Then you can make another one with the different style and different color and again for the third one Keep it around three or four I wouldn't do more than that because we don't want to have too many Inconsistencies on the website because it's not good for the design But you can get creative and have two three or four of them And then all you got to do is say you want to use this style a different color Instead of having GTX one of their and then you would just put your GTX to right inside the CSS classes It's that easy to do. There's no need for a plugin or anything like that. Well, I hope this helps out I hope you guys can minimize your add-ons and the plugins. You're adding to your elemental websites I got more videos and more tricks on how to achieve things without having to add a plugin or Elementor add-on in order to get it done because lately for the last couple years Our design studio has been focusing on keeping our elementor sites really light and fast So we got a whole lot of interesting things coming up. Make sure to subscribe like You know all that good YouTube stuff and I'll be back again one more Elementor tics tricks tricks with One more Elementor stuff and more web design related content. All right. Thank you