Typography Matching

I imported the demo icon 1.

However I find that the typography that is available on your demo site is different from the typography that I have on my website. When I try to increase the size, all the font sizes (heading, calendar etc) became bigger as well.

So my question is how do I do it?

My Site: http://beingabhinav.com

Demo Site: https://demo.theme.co/icon-1/5-reasons-you-need-the-x-theme/

Hi Abhinav,

Thanks for reaching out.

The demo has root font size of 12px, but you have changed yours to 14px hence a bit bigger.

I recommend changing it back to 12px if you wish to follow the demo font size.

Thanks!

I have tried it. When I do it, the heading size becomes small as well along with the calendar and sidebar etc.

In the olden days, we used to go into the CSS and increase the font size. I don’t find the same flexibility in this template. Is this by design?

I have changed it to size 12 and changed it to scaled. Now the body font size becomes even smaller than the demo. See image. The website too is with the same settings as well.

Hello Abhinav,

We have applied responsive typography in the theme. You might want to check this detailed information about it here:

If you also want to use custom css, you can also do that by setting the font sizes. Please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

h1, .h1 {
  font-size: 28px;
}

h2, .h2 {
  font-size: 24px;
}

h3, .h3 {
  font-size: 20px;
}

h4, .h4 {
  font-size: 18px;
}

h5, .h5 {
  font-size: 16px;
}

h6, .h6 {
  font-size: 14px;
}

Feel free to change the font size values that may apply to your site.

Hope this helps.

I dont want to add custom CSS. I merely want to replicate your demo. Can you compare your demo and my website font sizes? You will find that demo body font size is bigger. I want that. The title font size is same. I don’t want to change it.

Hello Abhinav,

To get exactly the same font size, please go to X > Theme Options > Typography > Body and Content and set the “Content Font Size (rem)” to 1.333. You currently have set it to 1 rem only.

If you need anything else we can help you with, please let us know.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.