Join Now

Having Trouble with Fonts? Try our Font Lookup Tool!

We mentioned this briefly in a newsletter a month ago, but for those that may have missed it... We've built a handy font lookup tool for quickly finding the proper CSS style names for fonts.

http://fonts.muse-themes.com/

Why are the CSS style names important? Because when it comes to widgets, font names can't be selected from a dropdown, like in the Muse Text Panel. Font names have to be entered manually into the widget option panel. And the font name has to be recognized as a proper CSS style name by the browser. 

While the majority of CSS font names are just made up of the font name with a "-" between words, no spaces. Example: the League Gothic font's CSS style name is "league-gothic". But there are many others who's CSS style names don't follow the same formula. Take a look at these:

Using our Font Tool, you can look up the font you're after, click the "Copy to Clipboard" button, then paste directly into the widget panel.

One more thing to remember is that whenever you enter a font name into a widget, be sure that the font is used somewhere on the same page. This way, the font will be loaded properly by the browser. All it takes is a single character, like a period. You can hide it off canvas if you like.

For a more in-depth article on the subject, check out our article Getting Web Fonts To Play Nice With Toolbox Widgets

You can find links to our font tool in the "Helpful Resources" sidebar on our Customer Support page, as well as in our footer.

As always, if you have any questions, please let us know!

Brandon Wallace
Brandon Wallace / Boise, ID

Brandon Wallace, esteemed Widget Master, started with MuseThemes in 2014. He manages all of our widgets – new and old – all while maintaining an unflinching commitment to food, music, and craft beer.

Comments

Shane
Shane

Hi, I looked up the font “FF Dagny Pro” using your Font Finder and it gave me this correct font name “ff-dagny-web-pro” which I put in the NAV System Pro widget. I also made a text box with the font like you suggested in the video.
How do I get it to display the Black or Bold version of FF Dagny Pro?

Also, I purchased the “Dagny Pro” font and uploaded it as a Self Hosted Font. How do I make sure these fonts will be used instead of relying on Typeface fonts?

I just purchased another year subscription to MuseThemes.
Thank you so much for your help!
Shane

Schranz
Schranz

Hello, can you tell me how I can use fonts from type kit, it seams not to work anymore, is urgent, thank you. Kind regards

Post A Comment

Trusted by Web Design Business Pros

Join now to grow from our entire library of templates, widgets, and tutorials Join Now