How to use custom fonts in your app

The default font used in Flutter is Roboto. If you want to add a custom font in Flutter, you have 2 ways. If the font you want to add is available in Google Fonts, you can use google_fonts package available in Dart Pub. If the font you want to use is not available in Google fonts, you must add a TTF file of the font to assets and load it using pubspec.yaml. Both methods are described in the following tutorial.

1. Using google_fonts Package

Install Package

Add google_fonts to pubspec.yaml as shown in below. There are no other configurations required for the plugin on both iOS and Android operating systems.

Usage

google_fonts package can be used to apply any desired font available on google fonts both as TextStyle of a Text() widget and inside the Theme() widget. Both the examples are shown below.

2. Adding fonts not available in Google fonts

Add TTF file of the font to assets

The first step is to get the TTF file of the font you would like to use and add it to the assets of your app. The folder structure is shown in the image below.

Add font to pubspec.yaml

Now we need to add the font to pubspec.yaml as shown below. This will load the font for usage inside our app.

Usage

Example usage of the font both as style of a Text() widget.