globalFontFace

Creates a globally scoped custom font.

text.css.ts
import {
  globalFontFace,
  style
} from '@vanilla-extract/css';

const comicSans = 'GlobalComicSans';

globalFontFace(comicSans, {
  src: 'local("Comic Sans MS")'
});

export const font = style({
  fontFamily: comicSans
});
CSS
@font-face {
  src: local("Comic Sans MS");
  font-family: GlobalComicSans;
}
.text_font__fih47p0 {
  font-family: GlobalComicSans;
}