# How to: Use IBM's Plex font in your theme

**URL:** https://discourse.roots.io/t/how-to-use-ibms-plex-font-in-your-theme/12277
**Category:** sage
**Tags:** guide, sage9
**Created:** 2018-04-21T00:13:57Z
**Posts:** 1

## Post 1 by @mmirus — 2018-04-21T00:13:57Z

IBM’s Plex font is open source and free for anyone to use. It’s a nice typeface, and works especially well in designs that are tech-related or otherwise need to feel “modern.”

It includes a number of weights, as well as sans, sans condensed, serif, and mono varieties.

Font promo: [https://www.ibm.com/plex/](https://www.ibm.com/plex/)  
Repo: [https://github.com/IBM/plex](https://github.com/IBM/plex)

Here’s how to start using it in Sage.

**Install the font**

```
yarn add @ibm/plex
```

**Define the font path prefix and Import the SCSS**

In `main.scss`:

```
/**
 * Import npm dependencies
 *
 * Prefix your imports with `~` to grab from node_modules/
 * @see https://github.com/webpack-contrib/sass-loader#imports
 */
// @import "~some-node-module";
$font-prefix: "~@ibm/plex";

@import "~@ibm/plex/scss/ibm-plex.scss";
```

**Add your styles**  
Write your SASS/CSS as you normally would to use the font. For example:

```
body {
  font-family: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif;
}
```

[Plex’s Github repository](https://github.com/IBM/plex) lists the font stacks for each family.