@font-face 웹폰트 생성기

웹 글꼴 생성기는 데스크톱 또는 다운로드한 글꼴 파일 (TTF, OTF, WOFF, WOFF2 — 현대 변수 글꼴 포함)을 브라우저가 웹을 통해 로드할 수 있는 형식으로 변환합니다 — 주로 오늘날 WOFF2, WOFF는 레거시 폴백으로 사용됩니다 — 그리고 웹사이트의 타이포그래피를 자체 호스팅할 수 있도록 일치하는 CSS @font-face 선언을 생성합니다.

왜 글꼴을 자가 호스팅하나요?

자체 호스팅은 성능, 개인 정보 및 신뢰성에 대한 완전한 제어를 제공합니다. Google Fonts에 대한 제3자 요청이 없으며 (GDPR에 유용), 추가 DNS 조회가 없고, 파일을 미리 로드할 수 있으며, 사이트와 함께 배송할 무게, 스타일 및 축을 정확히 결정할 수 있습니다.

변환이 작동하는 방식

WOFF2는 TTF/OTF 윤곽을 웹을 위해 특별히 설계된 Brotli 압축 컨테이너에 래핑합니다 — 일반적으로 WOFF보다 30% 작고 원시 TTF보다 50% 이상 작습니다. WOFF는 매우 오래된 브라우저를 위한 폴백으로 유지되는 오래된 zlib 압축 래퍼입니다. 우리의 생성기는 Google의 공식 WOFF2 인코더와 디코더를 WebAssembly로 컴파일하여 실행하므로 변환이 브라우저 내에서 로컬로 발생합니다. Google Fonts에서 다운로드한 WOFF2를 드롭하면 우리는 투명하게 그것을 sfnt 컨테이너로 다시 디코딩한 후 재인코딩합니다 — 원래 TTF를 찾을 필요가 없습니다.

번들에서 얻는 것

• 업로드된 모든 글꼴에 대해 WOFF2 (선택적으로 WOFF/TTF) 형식의 글꼴 — 변수 글꼴이 하나의 작은 파일로 유지됩니다.
• 파일당 하나의 @font-face 규칙이 포함된 완전한 stylesheet.css, 올바른 format() 힌트, font-weight 범위, font-style, font-stretch, font-display 및 선택적 local()이 포함됩니다.
• 모든 무게, 스타일 및 축을 여러 크기로 미리 볼 수 있는 demo.html 페이지.
• 오프라인 우선 또는 단일 파일 시나리오를 위해 CSS에 인라인으로 글꼴을 배송하는 선택적 Base64 포함.

개인 정보 보호 및 라이센스

파일은 귀하의 장치를 떠나지 않습니다 — 모든 것이 귀하의 브라우저에서 처리됩니다. 웹사이트에 게시하기 전에 항상 글꼴의 라이센스가 웹폰트 포함을 허용하는지 확인하세요.