# Font Family Customization

Customize the body and display fonts of your application through `WindTheme`, backed by the Google Fonts library.

- [Default Font](#default-font)
- [Customizing Fonts](#customizing-fonts)
- [Binding Fonts to the Flutter Theme](#binding-fonts-to-the-flutter-theme)
- [Related Documentation](#related-documentation)

```dart
WindTheme.setBodyFontString('Roboto');
WindTheme.setDisplayFontString('Lobster');
```

## Default Font

When you start a new application with wind, the default font family is **Inter**, a versatile sans-serif face. You can replace it with any font supported by Google Fonts to match your design.

## Customizing Fonts

`WindTheme` configures two fonts: the body font for general text content and the display font for large, prominent text such as headings.

### Body Font

The body font is the primary font used for general text content.

```dart
// Set the body font
WindTheme.setBodyFontString('Roboto');
```

After this call, all text styled with the body font defaults to **Roboto**.

```dart
// Retrieve the current body font
String currentBodyFont = WindTheme.getBodyFontString();
print('Current body font: $currentBodyFont'); // Output: 'Roboto'
```

### Display Font

The display font is typically used for large, prominent text such as headings or titles.

```dart
// Set the display font
WindTheme.setDisplayFontString('Lobster');
```

If no display font is set, `getDisplayFontString` falls back to the body font.

```dart
// Retrieve the current display font
String currentDisplayFont = WindTheme.getDisplayFontString();
print('Current display font: $currentDisplayFont'); // Output: 'Lobster'
```

## Binding Fonts to the Flutter Theme

To apply the configured fonts globally, bind them to Flutter's `ThemeData` through `WindTheme.toThemeData`, which integrates the font settings with Flutter's theme system. You can also pass `bodyFontString` and `displayFontString` directly to `toThemeData` to override the configured fonts for a single build.

```dart
MaterialApp(
  theme: WindTheme.toThemeData(
    bodyFontString: 'Roboto',
    displayFontString: 'Lobster',
  ),
);
```

For full guidance on applying fonts at the theme level, see [Binding the Flutter Theme](https://anilcancakir.com/wind_kit/docs/v0.0/getting-started/binding-the-flutter-theme.md).

## Related Documentation
- [Binding the Flutter Theme](https://anilcancakir.com/wind_kit/docs/v0.0/getting-started/binding-the-flutter-theme.md) — apply fonts at the theme level
- [Font Size](https://anilcancakir.com/wind_kit/docs/v0.0/customization/font-size.md) — customize the typographic scale
- [Font Weight](https://anilcancakir.com/wind_kit/docs/v0.0/customization/font-weight.md) — customize weight keys