# 페이북 글꼴

[배포처 바로가기](https://paybooc.co.kr/app/paybooc/RPastEventDetail.do?evntNo=2020040025)

 

## 웹 폰트

사용하는 `font-family`의 이름은 `Partial Sans KR`입니다.

### HTML

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc.css" type="text/css"/>
```

### CSS `@Import`

```css
@import url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc.css');
```

### CSS `@font-face`

```css
@font-face {
    font-family: 'paybooc';
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    src: url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-Light.woff2') format('woff2'),
         url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-Light.woff') format('woff'),
         url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-Light.otf') format('opentype'),
         url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-Light.ttf') format('truetype');
}
@font-face {
    font-family: 'paybooc';
    font-weight: 500;
    font-style: normal;
    font-display: swap;
    src: url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-Medium.woff2') format('woff2'),
         url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-Medium.woff') format('woff'),
         url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-Medium.otf') format('opentype'),
         url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-Medium.ttf') format('truetype');
}
@font-face {
    font-family: 'paybooc';
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-Bold.woff2') format('woff2'),
         url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-Bold.woff') format('woff'),
         url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-Bold.otf') format('opentype'),
         url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-Bold.ttf') format('truetype');
}
@font-face {
    font-family: 'paybooc';
    font-weight: 800;
    font-style: normal;
    font-display: swap;
    src: url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-ExtraBold.woff2') format('woff2'),
         url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-ExtraBold.woff') format('woff'),
         url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-ExtraBold.otf') format('opentype'),
         url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/paybooc-ExtraBold.ttf') format('truetype');
}
```

&nbsp;

## 다이나믹 서브셋

웹폰트의 최적화를 위해 모던 브라우저에서는 글리프를 여러개로 나누어 필요한 부분만 동적으로 파싱하는 다이나믹 서브셋을 제공합니다. 폰트의 용량이 부담된다면 아래 코드를 사용하는 걸 추천합니다.

### HTML

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/subsets/paybooc-dynamic-subset.css" type="text/css"/>
```

### CSS

```css
@import url('https://cdn.jsdelivr.net/npm/fonts-archive-paybooc/subsets/paybooc-dynamic-subset.css');
```

&nbsp;

## font-family

어느 브라우저나 시스템 환경에서도 동일한 폰트가 적용되어야 한다면 아래와 같이 구성하는 걸 추천합니다. `-apple-system`과 `BlinkMacSystemFont`는 맥, `Segoe UI`는 윈도우, `Roboto`는 안드로이드의 기본 폰트입니다.

```css
font-family: "paybooc", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
```

&nbsp;

## 라이선스

라이선스는 언제든지 변경될 수 있습니다. 변경사항을 확인하려면 배포처를 방문해 주세요.

```
BC카드 글꼴과 페이북 글꼴의 지적재산권은 비씨카드㈜가 소유하고 있습니다. 
BC카드 글꼴과 페이북 글꼴은 개인 및 기업 사용자를 포함한 모든 사용자에게 무료로 제공되며 상업적 목적으로 
자유롭게 사용할 수 있습니다. 
BC카드 글꼴과 페이북 글꼴을 유료로 판매하거나 어떠한 형태로든 임의 수정/개작하여 글꼴을 재배포 하는 것은 
엄격히 금지합니다.
```