to-css-font-import
This parser helps you create CSS @font-face rules to import your font files.
Interface
interface parser {
name: 'to-css-font-import';
output: {
type: 'file';
filePath: string;
};
options?: {
formats?: Array<'woff' | 'woff2' | 'ttf' | 'otf' | 'eot'>;
fontsPath?: string;
includeFontWeight?: boolean;
genericFamily?: string;
fontDisplay?: 'auto' | 'block' | 'swap' | 'fallback' | 'optional';
};
}
Options
Parameter
Required
Type
Default
Description
formats
false
Array<string>
['woff', 'woff2']
The list of formats to import.
fontsPath
false
string
The path of font's directory.
includeFontWeight
false
boolean
Allow to include the font-weight property in the result.
genericFamily
false
string
The generic font family will be applied after the main font family.
fontDisplay
false
string
swap
How your font face is displayed based on whether and when it is downloaded and ready to use.
Basic usage
{
"font": {
"interRegular": {
"$type": "font",
"$value": {
"default": {
"family": "Inter",
"postScriptName": "Inter Regular",
"weight": "regular",
"style": "normal",
"files": [
{
"format": "ttf",
"url": "https://static.specifyapp.com/sdtf-seeds/inter-regular.ttf",
"provider": "Specify"
}
]
}
}
},
"interMedium": {
"$type": "font",
"$value": {
"default": {
"family": "Inter",
"postScriptName": "Inter Medium",
"weight": "medium",
"style": "normal",
"files": [
{
"format": "ttf",
"url": "https://static.specifyapp.com/sdtf-seeds/inter-medium.ttf",
"provider": "Specify"
}
]
}
}
},
"interBold": {
"$type": "font",
"$value": {
"default": {
"family": "Inter",
"postScriptName": "Inter Bold",
"weight": "bold",
"style": "normal",
"files": [
{
"format": "ttf",
"url": "https://static.specifyapp.com/sdtf-seeds/inter-bold.ttf",
"provider": "Specify"
}
]
}
}
},
"firaCodeRegular": {
"$type": "font",
"$value": {
"default": {
"family": "Fira Code",
"postScriptName": "Fira Code Regular",
"weight": "regular",
"style": "normal",
"files": [
{
"format": "ttf",
"url": "https://static.specifyapp.com/sdtf-seeds/fira-code-regular.ttf",
"provider": "Specify"
}
]
}
}
}
}
}
Last updated
Was this helpful?