Vizlib Home

How do I use custom fonts with Vizlib Extensions?

Many of our extensions support custom fonts. Qlik Sense has theme support, you can create a custom theme here, in the CSS file for this theme, you can paste some code as shown below. This code should load the font onto your page, which the Vizlib object will be able to refer to using the "font-family" name. Typically a Qlik Sense Developer would load the font in using "@fontface" method. Once the font is loaded in the app theme (or mashup CSS), the Vizlib objects will then be able to display supported custom font files. 

@fontface method:

@font-face {  font-family: 'Indie Flower';  font-style: normal;  font-weight: 400;  src: local('Indie Flower'), local('IndieFlower'), url( format('woff2');  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

You can source fonts from sites like, please note, you must always have a license for the font you are using, fonts may not be free of charge.

Custom Fonts can easily be added using Vizlib Sheet Menu Custom CSS feature (shown below), or by using a Qlik Sense Theme.

Piers is the author of this solution article.

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.