폰트 (Font)

별칭: font · font family · 폰트 · 글꼴

화면의 글자가 어떤 모양으로 보일지 정하는 글꼴 또는 글꼴 묶음.

폰트는 화면의 분위기와 가독성을 크게 좌우한다. 웹에서는 font-family로 우선순위가 있는 글꼴 목록을 지정하고, 사용자의 기기에 해당 글꼴이 없으면 fallback 글꼴을 사용한다.

정의

폰트는 글자가 화면에 어떤 모양으로 표시될지 정하는 글꼴이다. 웹 CSS에서는 font-family로 하나 이상의 글꼴 이름과 generic family를 우선순위 목록으로 지정한다. 브라우저는 가능한 글꼴을 선택하고, 없으면 fallback 글꼴을 사용한다.

왜 중요한가

폰트는 단순 장식이 아니라 읽기 쉬움과 서비스 인상을 결정한다. 같은 카드 UI라도 폰트가 흔들리면 화면이 아마추어처럼 보일 수 있다. 특히 한국어 서비스는 한글 가독성, 숫자 정렬, 영문 혼용, 모바일 렌더링을 함께 봐야 한다.

Semiclass에서의 의미

의식 2에서는 폰트 1개를 정해 이후 모든 화면의 기준으로 삼는다. 예를 들어 Pretendard 같은 한국어 UI용 폰트를 기준으로 잡으면 카드 제목, 설명, 버튼, 필터의 톤이 일정해진다. AI 프롬프트에도 "이 폰트 기준을 유지해"라고 짧게 지시할 수 있다.

주의할 점

웹폰트는 로딩 속도에 영향을 줄 수 있다. 너무 많은 굵기와 스타일을 불러오면 초기 화면이 느려지고 글자가 늦게 바뀔 수 있다. 항상 system-ui나 sans-serif 같은 fallback을 함께 지정하는 편이 안전하다.

출처