If you've ever dropped a custom icon font into a Flutter app and then spent the next hour copying codepoints from a website into static const declarations, this one's for you.
(https://pub.dev/packages/iconfontextractor)
The real pain: Font Awesome Pro
My specific trigger for building this package was Font Awesome Pro. FA Pro is excellent — thousands of high-quality icons, multiple styles (solid, regular, light, thin, duotone), and a proper ligature-based font file. But integrating it into Flutter the "normal" way is a nightmare:
Find the codepoint for each icon you need
Write static const IconData faHouse = IconData(0xf015, fontFamily: 'FontAwesomePro') by hand
Repeat for every single icon across every style variant
Maintain it when you update the font
There are third-party packages that ship pre-built constant maps, but those only cover the free tier, go stale between FA versions, and add a dependency you have to trust. If you're paying for Pro, you have the font file — you should be able to use it directly, with zero manual work.
How iconfontextractor works
Icon fonts like Font Awesome Pro, Material Symbols, IcoMoon exports, and Fontello bundles all ship a GSUB ligature table inside the font file. That table maps human-readable strings ("house", "arrow-left", "trash-can") to glyph IDs, which are in turn mapped to codepoints via the font's cmap table.
iconfontextractor reads those two tables in pure Dart — no native code, no external font tooling — and emits a .g.dart file with a typed IconData constant for every ligature it finds.
Setup is few lines of YAML
You don't even add it as a dependency in your app. Install it globally once:
dart pub global activate icon_font_extractor
Then add a single block to your existing pubspec.yaml:
flutter:
fonts:
- family: FontAwesomePro # already here if you're using the font
fonts:
- asset: assets/fonts/fa-pro-6-solid-900.otf
icon_fonts:
- family: FontAwesomePro outputFile: lib/icons/fa_pro_solid.g.dart naming: snake # icn_house, icn_arrow_left, icn_trash_can iconPrefix: fa # fa_house, fa_arrow_left, …
Run the generator:
icon_font_extractor generate
And you're done. You get a file like this:
// GENERATED CODE - DO NOT MODIFY BY HAND.
import 'package:flutter/widgets.dart';
@staticIconProvider
abstract final class FontAwesomePro {
FontAwesomePro._();
/// Ligature: house
static const IconData fa_house = IconData(0xE001, fontFamily: 'FontAwesomePro');
/// Ligature: arrow-left
static const IconData fa_arrow_left = IconData(0xE002, fontFamily: 'FontAwesomePro');
// … hundreds more
}
Use it exactly like any built-in icon:
Icon(FontAwesomePro.fa_house, size: 24)
IconButton(icon: Icon(FontAwesomePro.fa_arrow_left), onPressed: _goBack)
The best part: tree-shaking just works
Flutter's icon tree-shaking is baked into flutter build — it scans your compiled Dart code for IconData literals and strips every glyph from the font that isn't referenced. This normally only works with the Material icon set because it requires @staticIconProvider-annotated classes.
iconfontextractor emits exactly that annotation on every generated class. So if your app uses 40 out of 2,000 Font Awesome icons, only those 40 glyphs end up in your release build. No manual subsetting, no IcoMoon round-trips, no --tree-shake-icons=false workarounds.
Multiple fonts, multiple styles
Font Awesome Pro ships separate files per style. No problem — list them all:
icon_fonts:
family: FontAwesomeProSolid
outputFile: lib/icons/fa_solid.g.dart
iconPrefix: fasfamily: FontAwesomeProRegular
outputFile: lib/icons/fa_regular.g.dart
iconPrefix: farfamily: FontAwesomeProLight
outputFile: lib/icons/fa_light.g.dart
iconPrefix: fal
Each gets its own generated file. One generate run covers all of them.
Naming flexibility
Every team has different conventions. Four built-in strategies cover the common ones:
| Strategy | Example output |
|---|---|
| snake (default) | faarrowback_ios |
| camel | faArrowBackIos |
| pascal | FaArrowBackIos |
| keep | faArrow-back-ios (as-is after sanitising) |
The prefix is also configurable (iconPrefix), and it participates in the chosen strategy — so snake with prefix fa produces fa_house, camel produces faHouse, and pascal produces FaHouse. Consistent all the way down.
CI-friendly
A --check flag makes the tool exit non-zero if any generated file would change without actually writing it. Drop it in your CI pipeline to catch stale generated code before it lands:
GitHub Actions / any CI
- run: dart pub global activate icon_font_extractor
- run: icon_font_extractor generate --check
Works for any icon font
Font Awesome is just the motivating example. The same workflow applies to:
Material Symbols (the newer variable-weight successor to Material Icons)
IcoMoon / Fontello custom bundles
Any font exported from Figma with ligature names
Internal design-system fonts your team owns
If the font has a GSUB ligature table, iconfontextractor can read it.
Get started
dart pub global activate icon_font_extractor
Feedback, issues, and PRs are welcome. If you're using Font Awesome Pro or another commercial font and hit an edge case, open an issue — the more real-world fonts this is tested against, the better.
Happy coding! 🎉
Top comments (0)