 If you're getting started using REM for your font sizes or you've been using REM for a while, but you wanna find an easier way to do it, well, this video is for you. So check it out, by default. Browsers, they're set to pixels. That's old school, they've always been doing that. But now, pixels for font sizes are not considered best practices. Things have changed and evolved. If somebody is visually impaired, they need to have the screen bigger. Well, when the fonts are set to pixels, they don't really adjust well to the screen. But by setting them to REM, well, the fonts, they're going to adjust very well to the screen and it's gonna make them accessible. Now, the challenge with this is when you got to convert pixels to REM, you gotta do some calculations sometime. So, by default, the base font in browsers is set to 16 pixels. Now, 16 pixels equals one REM. If you wanna make your font size 32 pixels, well, that's two REM. That's kinda easy math right there. But if you wanna make your font size 22 pixels, 54 pixels, and so on, then you gotta start breaking out your calculator or you could use a tool like what I use right here, which has been really, really helpful. But still, this deviates us from our workflow and it's not that productive. The way we are going to simplify this and make it a whole lot easier is to change that base font from 16 pixels to 10 pixels. I'm gonna show you how to do this in elements or but the same thing could apply to all of your WordPress websites no matter what builder you are using. Changing your base font from 16 pixels to 10 pixels is gonna make it so much easier to do the math and to figure it out. Because let's say you wanna make your font 20 pixels but you wanna turn that into REM. Well, that's two REM. If you wanna make it 22 pixels, that's 2.2 REM. You see, you don't need a calculator and you don't need to exercise your mind, I guess, if you don't really wanna do the math. So let me show you how to do this really quickly. We're gonna make the change here on my elemental website. Now to do this, it's super, super easy. We just have this little tiny, small NC bit of CSS. We gotta copy and paste it. Now really quick, let me explain it so you understand what this is doing. This is changing the base font of the website from 100%, which would equal 16 pixels because that is what browsers by default read the base font as. It is changing it to 62.5%. It's gonna turn that base font into 10 pixels. So let me copy and paste this and you can put it wherever you're putting your CSS. I'm gonna put mine here inside the customizer and well, I've already have it here and if I remove it, look what happens to all my font. You know, it blows up right here. So right here, I've already adjusted it. Now let me show you how this works and you're gonna see how much easier it's gonna be to use REM. My title here, I wanted to make it 62 pixels instead of having to do the math and figure out how many 16 pixels goes into, you know, how to get that into the REM. Well, I just set it to 6.2 REM. Now, if I wanna make this 42 pixels for mobile, I just set it to 4.2 REM. I don't have to do the calculation on it. So everything is set up good to go. You can see here, 4.8 REM, that's 48 pixels. That's for my large title. Doing this allowed me to set up my font sizes very quickly. I did not have to spend time doing the calculations or going to another website to pull out, you know, the converter from Pixel to REM. And that is it. You're pretty much good to go with it. Now this could be used inside some other areas. Let's say right over here, I wanted to make my gaps. Okay, I'm using a grid right over here. Let's say I wanted to make my gaps there are 20 pixels by 20 pixels. But let's say I wanna use REM instead of pixels. I could change this over to REM and I could just put in two and two. And then that makes that into, you know, equals 20 pixels, but it's going to be more accessible and it's following better practices. And you can find the snippet inside the description. It's free, no strings attached, go ahead and use it, have fun and just make your life a whole lot easier with it. This is a good place to start using REM by using it with font sizes and then implementing this into your practices. See, I for a long time use 16 pixels, but when I moved over to the 10 pixels and started using it this way that I'm showing you and making this part of my workflow, well, things got a whole lot easier. Also, we could use REM in other areas as well. It doesn't just have to be used with fonts. By doing this right now, setting it to 62.5%, doing your calculations based off of 10 pixels, it's going to make that transition a lot more seamless. I hope this really helped out. And I hope that this is helping you to build better practices as well. And if you want to continue building better practices for your web creation workflow, definitely do that good YouTube stuff. Like and subscribe. I'm all about best practices and I definitely got more coming out soon. That's it for this video. Thank you for watching. I'll be back soon. Thanks.