# 사용자 지정 글꼴 목록

- Human documentation: [https://docs.univer.ai/ko-KR/guides/pdfs/ui/fonts](https://docs.univer.ai/ko-KR/guides/pdfs/ui/fonts)

- Agent Markdown: [https://docs.univer.ai/ko-KR/guides/pdfs/ui/fonts.md](https://docs.univer.ai/ko-KR/guides/pdfs/ui/fonts.md)

- Requested language: `ko-KR`

- Content language: `ko-KR`

- Documentation version: `1.0.4`

- Source: [pdfs/ui/fonts.ko-KR.mdx](https://github.com/dream-num/documentation/blob/dev/content/guides/pdfs/ui/fonts.ko-KR.mdx)

---

PDF 텍스트와 편집기의 글꼴 메뉴는 서로 관련되지만 다른 데이터 원본을 사용합니다.

| 원본                                       | 제어하는 내용                                  |
| ---------------------------------------- | ---------------------------------------- |
| `document.assets.fonts`와 텍스트 런의 `fontId` | 네이티브 콘텐츠 재현에 사용하는 가져온 PDF 글꼴 메타데이터와 리소스. |
| 편집 가능한 텍스트 런의 `fontFamily`               | 편집 가능한 텍스트의 레이아웃과 렌더링에 사용하는 CSS 글꼴 패밀리.  |
| Univer 공유 글꼴 목록                          | PDF 검사기의 글꼴 드롭다운에 표시되는 옵션.               |

공유 목록에 옵션을 추가해도 `document.assets.fonts`에 에셋이 추가되지 않으며 글꼴 파일을 다운로드하거나 포함하지도 않습니다.

## 편집기 글꼴 목록 설정

`editor.enabled`가 `true`이면 PDF 검사기는 공유 `FontFamilyDropdown`을 사용합니다. 브라우저 설정의 `UniverUIPlugin`에서 목록을 구성하세요.

```ts
import { UniverUIPlugin } from '@univerjs/ui'

univer.registerPlugin(UniverUIPlugin, {
  container: 'app',
  customFontFamily: {
    list: [
      { value: 'Inter', label: 'Inter', category: 'sans-serif' },
      { value: 'Noto Serif', label: 'Noto Serif', category: 'serif' },
    ],
    override: false,
  },
})
```

브라우저 글꼴은 `@font-face`나 스타일시트로 직접 로드하세요. 로드되지 않으면 Canvas가 브라우저의 대체 글꼴을 사용합니다.

## 런타임에 옵션 추가

UI Facade를 로드한 뒤 `addFonts`로 같은 공유 목록에 옵션을 추가할 수 있습니다.

```ts
univerAPI.addFonts([
  { value: 'Inter', label: 'Inter', category: 'sans-serif' },
])
```

이 메서드는 애플리케이션 글꼴 목록만 업데이트합니다. 글꼴 바이트를 로드하거나 기존 PDF 텍스트 런을 다시 쓰지 않습니다.

## 편집 가능한 PDF 텍스트에 글꼴 적용

텍스트를 삽입할 때 `fontFamily`를 전달하거나 PDF Facade로 편집 가능한 텍스트 상자를 업데이트하세요.

```ts
const page = univerAPI.getActivePdf()?.getPageByIndex(0)
const textBox = page?.insertTextBox({
  text: 'Hello PDF',
  fontFamily: 'Inter',
  fontSize: 14,
  left: 36,
  top: 36,
})

textBox?.setTextStyle({ fontFamily: 'Noto Serif' })
```

`page.getTextSpans()`가 반환하는 가져온 네이티브 텍스트는 스냅샷이므로 바로 스타일을 바꿀 수 없습니다. `replaceText(...)`로 편집 가능한 텍스트 상자로 승격한 후 `setTextStyle`을 호출하세요.
