Change font sizes with custom CSS

Some users have requested help on changing font sizes on the theme, and as it’s not as simple as creating a setting for it, we recommend doing it with custom CSS.

You can add the following custom CSS to Appearance -> Customize -> Additional CSS if you’re on WordPress 4.7 +


Otherwise, if you’re on an earlier version of WordPress then you can install this custom CSS plugin by SiteOrigin:

You’ll then be able to add custom styling to your theme by going to Appearance -> Custom CSS.


Changing the default body font size:

textarea {
    font-size: 15px;


Main navigation font size:

.main-navigation li a {
    font-size: 16px;


Page Title font size:

.content-area .entry-header h1.entry-title,
.woocommerce-page {
    font-size: 40px;


Sidebar Title font size:

.widget-area h3.widget-title {
    font-size: 25px;


Footer social icons:

.footer-social-icon {
    font-size: 54px;


Footer address font size:

.site-footer-social-ad {
    font-size: 18px;


WooCommerce product title font size:

.woocommerce ul.products li.product h3,
.woocommerce-page ul.products li.product h3 {
    font-size: 26px;


WooCommerce single page product title:

.woocommerce div.product .product_title {
    font-size: 40px;


Let us know of any other sizes you may want help changing.


For custom work on the themes we recommend contacting Codeable.