Documentation

Individual Subsets

In the rare case that you need to import a specific subset of a font, you can do so by importing the subset’s CSS file. For example, if you only need the latin subset of the Open Sans font, you can import the latin.css file:

⬤⬤

import "@fontsource/open-sans/latin.css";
import "@fontsource/open-sans/latin-ext-300.css";
import "@fontsource/open-sans/greek-700-italic.css";

js

This is not available for variable fonts.

Note: We do not recommend using this method unless you have a specific reason to do so. The default CSS utilises the unicode-range property to only load the characters that are used on the page, which is more efficient than manually loading subsets.

Unsupported Fonts

Due to NPM package size limitations, the following packages do not support this feature:

  • @fontsource/noto-serif-hk