Anchor Design System

Fira Sans

Fira Sans is a core part of the Tryg brand identity and should be used consciously to ensure a balance between identity and legibility.

Introduction

Some Fira Sans introduction text here

Installation

npm i @fontsource/fira-sans

Usage

Within your app entry file or site component, import it in.

import "@fontsource/fira-sans"; // Defaults to weight 400
import "@fontsource/fira-sans/400.css"; // Specify weight
import "@fontsource/fira-sans/400-italic.css"; // Specify weight and style

Supported variables:

Weights: [100,200,300,400,500,600,700,800,900]
Styles: [italic,normal]
Subsets: [cyrillic,cyrillic-ext,greek,greek-ext,latin,latin-ext,vietnamese]

Note: italic may not be supported by all fonts. To learn more about what weights and styles are supported, please visit the Fontsource website.

Finally, you can reference the font name in a CSS stylesheet, CSS Module, or CSS-in-JS.

body {
  font-family: "Fira Sans";
}

Up to date usage documentation can be found here
https://www.npmjs.com/package/@fontsource/fira-sans

On this page