diff --git a/src/utils/downloadGoogleFont.ts b/src/utils/downloadGoogleFont.ts new file mode 100644 index 0000000..5a899a7 --- /dev/null +++ b/src/utils/downloadGoogleFont.ts @@ -0,0 +1,22 @@ +import FontFaceObserver from 'fontfaceobserver' + +export const downloadGoogleFont = async (font: string): Promise => { + const href = assembleFontLink(font) + + const link = document.createElement('link') + link.href = href + link.rel = 'stylesheet' + + document.head.appendChild(link) + + await new FontFaceObserver(font).load() + + document.documentElement.style.setProperty('--font-family', font) +} + +const assembleFontLink = (font: string) => { + return `https://fonts.googleapis.com/css2?display=swap&family=${font.replaceAll( + ' ', + '+' + )}` +}