In this article, I've explained how to use alternate fonts in Flutter.
In flutter, we have 2 options to change the fonts.
- Use as a default app font.
- Use for a specific widget.
But before that, you need to download the fonts from https://fonts.google.com/ or any other alternate location you know.
And then add that to the pubspec.yaml file. Example below,
fonts:
- family: CM Sans Serif
fonts:
- asset: assets/fonts/cm_sans_serif_2012.ttf
Once added to the pubspec.yaml file, you are ready to use them in the app. So, let's explore the 2 options we have to change the fonts of the app.
1. Use as a default app font.
In order to change the default font of the app so that all the widgets can use the same fond, you need to set it as a fontFamily in side ThemeData. Example below,
return MaterialApp(
title: 'Demo App',
theme: ThemeData(fontFamily: 'CM Sans Serif'),
home: MyHomePage(),
);
2. Use for a specific widget.In order to change the font of a specific Text widget, pass it through fontFamily property of TextStyle. Example below,
child: Text('Hello World', style: TextStyle(fontSize: 30.0, fontFamily: 'CM Sans Serif'),)
If you want more fonts that are free for commercial use, check this link https://www.websiteplanet.com/blog/best-free-fonts/
Srikanth