Inter typeface family
한글 日本語 中文
21세기 폰트의 표준, 이젠 CJK로.
폰트 다운로드Inter CJK는 Inter의 라틴 글리프와 Pretendard JP의 CJK 글리프를 결합하고, UI 환경에 맞게 일부 형태와 사용성을 보정한 서체입니다.
Pretendard는 한국어 기반 UI와 다국어 환경을 폭넓게 커버할 수 있는 균형 잡힌 서체입니다. 다만 영문 중심의 인터페이스, 기술 문서, 코드성 텍스트가 함께 등장하는 환경에서는 Inter가 가진 영문 가독성과 기호 표현의 정교함이 더 잘 맞는다고 판단했습니다.
또한 40px 이상의 Hero 문구에서는 더 높은 시인성과 또렷한 인상을 위해 Inter Display를 주로 사용합니다. Pretendard는 별도의 Display용 Optical Size를 제공하지 않기 때문에, 큰 크기의 제목 영역에서는 Inter Display가 더 안정적인 선택이었습니다.
Inter CJK는 Inter와 마찬가지로 본문용 Optical Size와 Display용 Optical Size를 모두 제공합니다. 이 과정에서 CJK 글리프도 Display Optical Size에 맞춰 추가로 보정했습니다.
OpenType 기능 역시 Pretendard와 Inter 양쪽의 장점을 놓치지 않도록 설계했습니다. 두 서체가 제공하는 주요 OpenType 기능을 함께 지원하며, CJK 환경에서 특히 중요한 세부 보정도 함께 반영했습니다. 예를 들어 Pretendard의 ss05를 지원하고, 구두점과 괄호의 기본 정렬이 언어에 따라 자연스럽게 보이도록 rclt를 통해 보정했습니다.
또한 Figma와 같은 상용 디자인 툴에서의 UI 설계를 고려해, UI 전용 서체인 SUIT의 Vertical Metrics를 참고했습니다. UI에서 자주 사용하는 본문 크기인 16px과 18px에서 기본 줄간격이 짝수로 떨어지도록 설정했으며, 글자의 위아래 빈공간이 균형 있게 맞춰지도록 조정해 버튼과 같은 컴포넌트에서 텍스트가 시각적으로 가운데에 맞추어져 있습니다.
Latin · Cyrillic · Greek
1,133자
한글
11,172자 전체 음절
일본어 가나
184자
CJK 한자
7,490자
기호 · 구두점 · 통화
200+자
Font Family
OpenType 기능
rligss05chws, halt「東京」、星になれた綺麗な。
ss02, ss06Il1l Illegal 0O
frac1/3 5/9 1/4 2/7
tnum₩1,111,111
Inter CJK는 Inter와 Pretendard의 OpenType 기능을 통합하고, CJK 언어 환경에 최적화된 기능을 추가했습니다.
라틴 문자와 한글·중문·일문이 함께 쓰이는 상황에서도 자연스러운 글리프 선택과 안정적인 정렬을 제공합니다.
그 외 아래의 OpenType 기능들을 제공합니다.
aaltAccess All AlternatescaltContextual AlternatescaseCase-Sensitive FormsccmpGlyph CompositiondligDiscretionary LigaturesdnomDenominatorsfracFractionsloclLocalized FormsnumrNumeratorsordnOrdinalspnumProportional FiguresrligRequired LigaturessaltStylistic AlternatessinfScientific InferiorssubsSubscriptsupsSuperscripttnumTabular FigureszeroSlashed Zeross01–ss16Stylistic Setscv01–cv14Character VariantschwsContextual Half-widthcpspCapital SpacinghaltAlternate Half WidthskernKerningmarkMark PositioningmkmkMark-to-Markss05Korean Localization설치 및 사용하기
웹 폰트로 사용하기
<link href="https://cdn.jsdelivr.net/npm/inter-cjk/dist/web/inter-cjk.css" rel="stylesheet">
웹 폰트로 사용하고자 하는 경우, 상단에 해당 코드를 추가해주세요.
만약 경량 로딩을 위해 Dynamic Subset이나 Static 폰트가 필요한 경우, dynamic-subset/inter-cjk-variable-dynamic-subset.css 이나, InterCJK-{weight}.css를 로딩해주세요.
Next.js에서 사용하기
npm i inter-cjkimport { InterCJK, InterCJKDisplay } from "inter-cjk/font"; import { InterCJK } from "inter-cjk/font/sans"; import { InterCJKDisplay } from "inter-cjk/font/display";
body { font-family: var(--font-inter-cjk), sans-serif; }
Next.js에서 사용하고자 하는 경우, npm으로 폰트 패키지를 설치해 라이브러리를 layout.tsx에 import하거나, globals.css에 해당 CSS를 추가해주세요.
Variable 사용법
body { font-family: "Inter CJK Variable"; font-variation-settings: 'opsz' 14; } h1 { font-family: "Inter CJK Variable"; font-variation-settings: 'opsz' 32; }
Variable 폰트를 사용하는 경우, font-variation-settings를 통해 opsz 값을 조절하여 본문용 텍스트 또는 디스플레이용 텍스트에 맞게 사용해주세요.
라이센스 및 기여
Inter CJK는 Inter 및 Pretendard와 마찬가지로 SIL Open Font License 1.1을 따릅니다.
따라서 이 폰트는 해당 라이선스의 조건에 따라 자유롭게 사용할 수 있습니다.
또한 Inter CJK는 전문 폰트 툴 없이 OpenCode만으로 제작된 폰트입니다.
평소 UI 디자이너로서 가지고 있던 고민과 관점을 폰트에 담고자 했습니다. 그 과정에서 사소한 오차나 미처 발견하지 못한 부분이 있을 수 있습니다.
사용 중 발견한 문제나 개선 아이디어가 있다면 GitHub 레포지토리를 통해 제안과 기여를 보내주세요. 많은 관심과 기여를 부탁드립니다.