How To Change Font Size in Elementor

How To Change Font Size in Elementor: Edit Your Typography Promptly

If you want a jaw-dropping website appearance, then you must focus on the fonts. To catch the attention of the audience, font size really matters. The right kinda typography will make it eye-catchy, and the wrong one will bore the audience.

As a beginner, one must wonder how to change font size in elementor. We will give you a step-by-step guide on this. Here we have highlighted all the necessary info which you will be needing while changing the font size. So before making any further delay, let’s read.

Why It’s Important To Change the Font Size

Dealing with the font size might look like an easy job. But it plays a crucial role in making your website more user-friendly and reachable. There are some potential aspects of the right font size. These are as follows:

1. Establishes a Proper Message and Layout

How To Change Font Size in Elementor

If you put the right color and font size, this will express the right message to the user. The right hierarchy will help in page ranking and indexing as well. The proper text size will define your messages to the user.

2. To Differentiate Message

To Differentiate Message

You can play with text size in different ways. By sorting the font size based on the content, your user will get insight into what you are saying. For example, you can use the Bold style for the heading normal for the rest.

3. Makes the Text Attractive

Makes the Text Attractive

On top of everything, you can style your font with appealing colors and styles so that it will create a unique and appealing site for the user. The look creates a great impression. This matters a lot.

How to Change Font Size in Elementor: Step by Step Guide

The function of the elementor pro varies from version to version. We have featured the most usual guidelines to change the font size. To do that, follow the steps listed below:

Step 1: Go to The Widget Settings

Go to The Widget Settings

Under the widget settings, click on the style. There you will find the Typography tab. Tab on the edit icon.

Step 2: Change the Font Size

How To Change Font Size in Elementor

Under this edit button, you will be able to change the font. Besides, this menu will let you change the style, color letter spacing, decoration, etc., as well.

To Style Directly on the Elementor Panel

1. Non-CSS Classes User

Non-CSS Classes User

In case you are not using custom CSS classes to styler and change your text directly, you can run the following codes:

<span style=”font-size: 30px; color: red”>

Here the size and color preference is shown as an example. You can set the color as your preference.

2. CSS Classes User

CSS Classes User

This method is a bit different from the previous one. Those who use CSS classes can go for the following method to change and style their fonts.

Step 1: Switch to the Text Editor

After switching the text editor, type the following codes in your editor to add classes in your paragraph. Now type the following codes before your paragraph

<p class=”name-of-your-class”>
Step 2: Add Span Tags

To add the span tags type the following code in your editor

<p class="body-copy">This is your text. And <span>this part</span>

should appear bigger.

Step 3: Style the Span

To style the text under span tags type the following code,

.body-copy span{

   color: red;

   font-size: 30px;


You can put the color and size of your preference here. Now your job is done.

You can read: How to Edit WooCommerce Shop Page with Elementor? Easy Solution

Best Typography Plugins for Better Style

For better text styling, you should always choose the best plugins. After scrutinizing thousands of plugins, we recommend the following plugins as the best.

1. Fonts Plugin

Fonts Plugin

This is a free plugin that gives access to the Google Fonts and Adobe Fonts libraries. From where you will be able to choose your likely fonts from 1000 google and Adobe fonts. In addition, you can test different options to customize. For more options, you can upgrade to Fonts Plugin Pro.

2. Easy Google Fonts

 Easy Google Fonts

Like Font Plugin, Easy Google fonts is one of the best plugins for WordPress text customization. The unique part about this plugin is it will let you review the google fonts before adding them to your paragraph. Moreover, this will allow you to create custom front controls and admin rules. In addition, you will get access to google fonts as well.

3. WP-Typography

WP typography is one of the best free plugins for text customization. It adds an extra effect to your fonts. With this, you will be able to add a hyphenation rule. This plugin will automatically replace the characters with suitable alternatives. Moreover, this will include an extra effect of fractions as well.


Question 1: How Do I Change Text in Elementor?

Answer: To change the text in your elementor follow the steps listed below:

Step 1: Go to the desired page and tab on the ‘Edit with Elementor’ Option.

Step 2: Click on the middle text on the screen and tab on the left editing window. Now remove the words and enter your text. You are done.

Question 2: How Do I Change the Size of Text in WordPress?

Answer: To change the size of your text, go to the default toolbar in WordPress block editor. Now click on the paragraph, and select the text size under ‘Typography.’ Now, you can set the size between small, medium, and large size.

Question 3: How Do I Change the Size of My Text Font on My Android?

Answer: You can change your android texts by the following method.

Step 1: Go to the settings and tap on the display toolbar. Click on the Advanced menu.

Step 2: There, you will get the text size now; you can choose your preferred size there.

Question 4: Elementor Font Size Not Changing, What to Do?

Answer: This happens mostly to the elementor widget. To fix this, set the elementor fonts to the default. So that typography takes action on your crisis.


No matter how simply changing the font size is for beginners, it’s always a new battle. That’s why we have featured the easiest and quickest tricks. Now we hope you know how to change font size in elementor. We believe this information will help you to decorate your texts in a better way. Happy browsing!

3 thoughts on “How To Change Font Size in Elementor: Edit Your Typography Promptly”

  1. Pingback: How to Change Heading Color in WordPress: Make Your Headings Notice within 2 Minutes - EazyPlugins

  2. Pingback: How to Copy a Page in WordPress Elementor - EazyPlugins

  3. Pingback: Elementor Animated Headline Not Working: Quickest Solutions to Fix Your Smart Headlines - EazyPlugins

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top