Working with Custom Fonts
Last updated
Was this helpful?
Last updated
Was this helpful?
Airkit comes with fonts out of the box, which are pulled from available Google Fonts. It is also possible to upload custom fonts. Custom fonts are great for matching fonts in an application to exactly match a style or brand.
Airkit will accept the following font types:
.otf
.ttf
.woff
.woff2
🚧 Fonts used out of the box are pulled from Google Fonts and may be removed at any time without our knowledge.
To add a custom font, go to Media Library in the Builder Bar and click on the Upload button. Upload the font to be used in the application.
The Font will be added as an asset to the Media Library and can now be used as a Font style.
Fonts can be easily changed across an application by changing the primary font at the Theme level. To change the primary font, go to Theme Builder and select 'Theme' in the tree.
Then go to the Inspector and expand the Fonts accordion. To change the primary font, click on the font name next to brandPrimaryFont and select the Custom Font tab. Select the font to be used, and click on Save. Any Google Font can also be used here as well.
Now all labels or text that is using the brandPrimaryFont variable will use the new custom font that was selected.
Additionally, to add a secondary font variable that can be used across the application, click on the '+' icon next to Fonts and add another variable name with an associated font. This is useful if the application required a completely different font for certain areas or flows of the application.
Custom fonts are just one of the many styling tools to help build out applications to match a specific brand or look and feel. To dive deeper into topics related to styling see:
.gif)
