Modern Font Stacks - 시스템 폰트를 사용한 폰트 스택
(modernfontstacks.com)- 최신 OS들의 '시스템 폰트'를 사용한 폰트 스택 CSS들을 제공
- 내장 폰트라 웹폰트 다운로드가 필요 없으므로 빠른 웹페이지 구성 가능
- 15가지 서체 종류
- System UI : OS의 기본 UI 폰트들
-
font-family: system-ui, sans-serif;
- 맥/iOS San Francisco, 윈도우는 Segoe UI, Android는 Roboto, Linux는 Ubuntu 등을 사용하게 됨
-
- Transitional : 신/구의 조화
-
font-family: Charter, 'Bitstream Charter', 'Sitka Text', Cambria, serif;
-
- Old Style : 둥근 쉐리프가 특징인 르네상스 시대 폰트
-
font-family: 'Iowan Old Style', 'Palatino Linotype', 'URW Palladio L', P052, serif;
-
- Humanist : 유기적인 캘리그래피 형태, 르네상스시대의 손글씨에서 영감 받음. 다른 산세리프보다 읽기 쉬움
-
font-family: Seravek, 'Gill Sans Nova', Ubuntu, Calibri, 'DejaVu Sans', source-sans-pro, sans-serif;
-
- Geometric Humanist : 균일한 획 너비가 특징으로 헤드라인 용으로 자주 사용
-
font-family: Avenir, 'Avenir Next LT Pro', Montserrat, Corbel, 'URW Gothic', source-sans-pro, sans-serif;
-
- Classical Humanist : 세리프로 끝나지 않고 획 끝에서 미묘하게 넓어짐
-
font-family: Optima, Candara, 'Noto Sans', source-sans-pro, sans-serif;
-
- Neo-Grotesque : 19세기말~20세기 초에 발달한 산세리프 스타일
-
font-family: Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Nimbus Sans', Arial, sans-serif;
-
- Monospace Slab Serif : 고정 너비 문자. 단순함. 보고서, 표, 기술문서에서 타자기 출력 에뮬레이션
-
font-family: 'Nimbus Mono PS', 'Courier New', 'Cutive Mono', monospace;
-
- Monospace Code : 프로그래밍 용. 고정폭에 읽기 쉬움
-
font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
-
- Industrial : 19세기 후반에 시작. 대담한 산세리프, 단순하고 직설적인 모양
-
font-family: Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif;
-
- Rounded Sans : 둥글게 휘어서 더 부드럽고 친근한 느낌. 어린이 친화적
-
font-family: ui-rounded, 'Hiragino Maru Gothic ProN', Quicksand, Comfortaa, Manjari, 'Arial Rounded MT Bold', Calibri, source-sans-pro, sans-serif;
-
- Slab Serif : 서체 끝에 두껍고 블록모양의 세리프
-
font-family: Rockwell, 'Rockwell Nova', 'Roboto Slab', 'DejaVu Serif', 'Sitka Small', serif;
-
- Antique : 19세기에 유행. 블록 같은 세리프와 두껍고 균일한 획 두께가 특징
-
font-family: Superclarendon, 'Bookman Old Style', 'URW Bookman', 'URW Bookman L', 'Georgia Pro', Georgia, serif;
-
- Didone : 모던 서체. 굵은 획. 브라케팅이 없는 헤어라인 세리프
-
font-family: Didot, 'Bodoni MT', 'Noto Serif Display', 'URW Palladio L', P052, Sylfaen, serif;
-
- Handwritten : 손글씨
-
font-family: 'Segoe Print', 'Bradley Hand', Chilanka, TSCu_Comic, casual, cursive;
-
- System UI : OS의 기본 UI 폰트들
깃헙 페이지에서 보면 각 OS별로 어떻게 보이는지 손쉽게 비교가 가능합니다.
https://github.com/system-fonts/modern-font-stacks