무료 글꼴 — 인기 사이트, 실시간 미리보기 및 사용 방법
무료 글꼴에 대한 신뢰할 수 있는 소스를 찾아보고, 실시간 미리 보기를 테스트하고, 깔끔한 CSS를 복사하고, 웹 글꼴을 사용하는 올바른 방법을 알아보세요. 오픈 소스, 무료 상업용 및 개인용 컬렉션이 포함되어 있습니다.
구글 글꼴
OFL빠른 글로벌 CDN, 하위 세트 및 가변 글꼴을 갖춘 최대 규모의 오픈 소스 라이브러리입니다. 웹과 앱에 이상적입니다. 대부분의 제품군은 SIL Open Font License를 사용합니다.
Fontshare(ITF 제공)
무료Indian Type Foundry에서 무료로 제공하는 고품질 서체. 깔끔한 제품군, 간편한 CDN 삽입 및 다양한 변수 옵션.
글꼴 다람쥐
무료 상업용무료 상업용 글꼴에 초점을 맞춘 엄선된 디렉토리입니다. 자체 호스팅을 위한 웹폰트 생성기가 포함되어 있습니다.
이동식 리그
OFLLeague Spartan 및 Raleway와 같은 시대를 초월한 제품군을 갖춘 클래식 오픈 소스 파운드리입니다. 브랜딩 및 편집에 적합합니다.
벨베틴
OFL독특한 디스플레이 스타일을 갖춘 실험적인 오픈 소스 서체입니다. 포스터, 문화, 창작 작업에 적합합니다.
집단
OFL오픈 라이센스에 따라 고품질 무료 글꼴을 출시하는 커뮤니티 파운드리입니다. 강력한 편집 및 표시 옵션.
오픈 파운드리
OFL테스트 도구와 디자인 중심 프레젠테이션을 갖춘 엄선된 오픈 소스 글꼴 인덱스입니다. 신선한 가족을 발견하는 데 이상적입니다.
1001 글꼴
혼합 라이센스무료로 사용할 수 있는 필터가 포함된 대용량 디렉토리입니다. 가족당 라이선스를 읽어보세요. 대부분은 개인적인 용도로만 사용됩니다.
다폰트
개인 용도개인 프로젝트와 영감을 위한 최고의 거대한 아카이브입니다. 라이센스는 매우 다양합니다. 각 다운로드 페이지를 확인하세요.
아이콘 글꼴(Font Awesome, Material Icons, Remix 아이콘)
무료 등급글꼴 파이프라인을 사용하는 UI 아이콘의 경우. 최신 SVG 아이콘 시스템을 고려해 보세요. 하지만 아이콘 글꼴은 빠른 추가에 여전히 유용합니다.
실시간 미리보기 및 CSS 조각
로컬 전용 - 업로드된 항목 없음기능 비교(스냅샷)
라이선스는 제품군에 따라 다릅니다.| 대지 | 오픈 소스 | 무료 상업용 | 가변 글꼴 | CDN/웹폰트 | 메모 |
|---|---|---|---|---|---|
| 구글 글꼴 | 예 | 예* | 예 | 예 | 최대 규모의 라이브러리, 빠른 CDN |
| 글꼴 공유 | 혼합 | 예 | 많은 | 예 | 현대 가족 |
| 글꼴 다람쥐 | 혼합 | 예* | 일부 | 발전기 | 상업적 용도로 선별됨 |
| 이동식 리그 | 예 | 예 | 일부 | 자체 호스트 | 시대를 초월한 클래식 |
| 벨베틴 | 예 | 예 | 일부 | 자체 호스트 | 실험적 디스플레이 |
| 다폰트 | 아니요 | 다양함 | 약간의 | 아니요 | 개인 프로젝트에 적합 |
웹에서 무료 글꼴을 사용하는 방법
- 라이센스 확인: OFL 및 기타 허용 라이센스는 상업용 프로젝트에 가장 적합합니다. 일부 사이트에는 개인용 글꼴이 나열되어 있습니다.
- 전송 선택: 속도를 위한 CDN 링크 또는 자체 호스트 @글꼴-얼굴 제어 및 개인 정보 보호를 위해.
- CLS가 문제가 되는 경우 주요 텍스트에 중요한 글꼴을 미리 로드하세요. 플래시를 방지하려면 대체 스택을 정의하세요.
- 요청을 줄이고 유연한 가중치를 얻으려면 가능한 경우 가변 글꼴을 선호하세요.
CDN 예
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
<style>
body{ font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }
</style>
자체 호스트 예
@font-face{
font-family: "MyFont";
src: url("/fonts/MyFont-Variable.woff2") format("woff2");
font-display: swap;
}
body{ font-family: "MyFont", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }
* 항상 원본 사이트에서 각 가족의 라이선스를 확인하세요.
자주 묻는 질문
Google Fonts는 상업용으로 무료인가요?
대부분은 OFL로 출시되며 상업적인 용도로는 무료입니다. 각 패밀리 페이지에서 라이선스를 확인하세요.
아이콘 글꼴을 사용해야 합니까, 아니면 SVG 아이콘을 사용해야 합니까?
SVG 아이콘은 최신 앱에 더 유연합니다. 아이콘 글꼴은 빠른 설정이나 레거시 파이프라인에 여전히 유용합니다.
웹 글꼴이 사이트 속도에 영향을 미치나요?
예. 사용 글꼴 표시: 교환, 가능한 경우 하위 집합을 만들고 계열과 가중치를 제한합니다.
최고의 범용 글꼴은 무엇입니까?
Inter, Roboto 및 Source Sans 3는 다재다능합니다. 제목에는 Merriweather 또는 Playfair와 같은 세리프체를 사용하세요.