---
type: snippet
kind: Recipe
tags: ['font']
status: release
ctime: 2022-12-29
mtime: 2026-08-19
generated: { by: claude/opus-5, at: 2026-08-19T00:00:00Z }
verified: { by: claude/opus-5, at: 2026-08-19T00:00:00Z }
sources:
  - id: developer-mozilla-en-us-docs
    resource: https://developer.mozilla.org/en-US/docs/Web/API/CSS_Font_Loading_API
    title: "CSS Font Loading API"
---

```js
async function loader() {
  const family = 'Material Symbols Outlined'
  const source =
    'url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v75/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsLjBuVY.woff2)'
  const fontFace = new FontFace(family, source)

  document.fonts.add(fontFace)
  await fontFace.load()
}
```

---

- 참고: [CSS Font Loading API](https://developer.mozilla.org/en-US/docs/Web/API/CSS_Font_Loading_API)