docs/src/components/FontFace.tsx
export const FontFace = () => (
<style jsx global>
{`
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 100;
font-display: block;
src: url(/fonts/Inter.woff2) format('woff2');
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 200;
font-display: block;
src: url(/fonts/Inter.woff2) format('woff2');
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 300;
font-display: block;
src: url(/fonts/Inter.woff2) format('woff2');
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 400;
font-display: block;
src: url(/fonts/Inter.woff2) format('woff2');
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 500;
font-display: block;
src: url(/fonts/Inter.woff2) format('woff2');
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 600;
font-display: block;
src: url(/fonts/Inter.woff2) format('woff2');
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 700;
font-display: block;
src: url(/fonts/Inter.woff2) format('woff2');
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 800;
font-display: block;
src: url(/fonts/Inter.woff2) format('woff2');
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 900;
font-display: block;
src: url(/fonts/Inter.woff2) format('woff2');
}
`}
</style>
)