# Google Font Embedder

**URL:** <https://talk.observablehq.com/t/google-font-embedder/5412>\
**Category:** Show and tell\
**Created:** [August 4, 2021, 1:32am UTC](https://talk.observablehq.com/t/google-font-embedder/5412 "2021-08-04T01:32:43Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![triptych](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/triptych/32/4001_2.png) [@triptych](https://talk.observablehq.com/u/triptych)\
**Post date:** [August 4, 2021, 1:32am UTC](https://talk.observablehq.com/t/google-font-embedder/5412/1 "2021-08-04T01:32:44Z")

</div>

I like how I can style an Observable notebook via just adding a style block, and often I want to have a custom font. I combined these ideas and created a shareable component called Google Font Embedder. If you want a notebook to have a font from Google Fonts, just name it in your notebook and import this cell

> **[Google Font Embedder](https://observablehq.com/@triptych/google-font-embedder)**
>
> usage: \`\`\`import {style} from "@triptych/google-font-embedder"\`\`\` or \`\`\` import {style} with {myFontName as fontName} from "@triptych/google-font-embedder"\`\`\` Example page with different font used...

(I include an example page and references )