How to override the font?

Topic: How to override the font?

spicelogic asked 4 years ago

Hello, After I apply the MDB Css and javascript, all of the website's fonts are changed and I do not like that font. I rather like the original Bootstrap font. Now, how can I use MDB but stop getting the fonts applied?

Tomek Makowski staff commented 4 years ago

Just add in your custom CSS file font-family: your custom font.

Regards

Add comment

spicelogic answered 4 years ago

0 0 Best answer

I actually did that. I have used following CSS for my body tag.

body {

font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"

}

But, still I see the regular MDB font all over my site. If I comment out the MDB CSS link from my html, only then, I see my regular expected font.

I am really feeling bad that, only for the font, I cannot use MDB. I really want to use the MDB library. I even tried the SASS file, by commenting out the font family variable, still, I see no change. Is there any way I can avoid the MDB font?

Here is the comparison. Please check these screenshots. You can see that, without MDB css, my page fonts look vivid and alive, which I like most. But, after applying MDB css, the whole site looks muted, the texts are not pleasant to read. In the screenshot, notice that, even the hyperlinks do not look like links.

So, am I missing anything?

enter image description here