Repository - API - Source
For a full migration guide, please visit the documentation.
// Before
import "@fontsource/roboto-flex/variable.css";
// After
import "@fontsource-variable/roboto-flex";
// Before
body {
font-family: "Roboto FlexVariable", sans-serif;
}
// After
body {
font-family: "Roboto Flex Variable", sans-serif;
}
wghtOnly
suffix. #388@fontsource/material-icons-rounded
to @fontsource/material-icons-round
. #363metadata.json
. #156font-display
property using CSS variables. #121LICENSE
file in each package. #156Brand new website has been released! Please note that it is very rough around the edges and we would appreciate PRs to help improve it! #558
Huge shoutout to jsDelivr for sponsoring the design for the new website and Fly.io for sponsoring the hosting!
Changed weight metadata from a string array to number array. e.g. ["400"] [400] #240
Removed local font names in CSS selector of src:
which should cut down on inconsistencies of OS installed fonts. #240
Package names have been renamed from fontsource-<font name>
to the safer, more authentic scoped format @fontsource/<font name>
.
That means all packages will need to be reinstalled with yarn add @fontsource/<font name>
or npm install @fontsource/<font name>
with imports updated to the new package such as import @fontsource/open-sans/400-italic.css
. #108
import @fontsource/<font name>/<weight>.css
now only contains normal style variants of fonts. The -normal.css
files throughout the respository have been removed. Importing italic variants remain the same via import @fontsource/<font name>/<weight>-italic.css
.
Please see #88 for more details. #112
import @fontsource/<font name>/<weight>.css
. #92 #115import fontsource-<font name>
or index.css
no longer defaults to contain ALL weights and styles for a font. It now only contains weight 400 with all styles included. This was changed to prevent fonts, such as Noto Sans JP, to counter-intuitively generate 1MB+ CSS files with the new unicode-range feature.
Simply choose the necessary weights and styles from now on with import fontsource-<font name>/<weight>.css
or import fontsource-<font name>/<weight>-<style>.css
. #37 #42
TTF/OTF support has been removed due to NPM package size limitations. Browser compatability goes as low as: caniuse #44
import fontsource-<font name>/<weight>.css
or import fontsource-<font name>/<weight>-<style>.css
to leverage the new feature from now on. #37FONTLIST.md
and added FONTLIST.json
. #58CHANGELOG.md
to every individual package. #41These occur when an automatic update is pushed from a source, such as Google, or Fontsource may apply patches. Due to version mismatching and lack of accurate tracking, a specific version for a Fontsource patch cannot be logged into the changelog. Note that Google may push breaking changes on their end to individual fonts which Fontsource cannot predict for.
These will always contain changes from Fontsource's end.