나눔고딕 웹폰트 적용법

Nanum Gothic · 굵기 3종 · OFL 1.1 · Google Fonts 배포

국내 웹에서 제일 오래 굴러온 폰트. 무난하지만 요즘 감성은 아니다.

미리보기

다람쥐 헌 쳇바퀴에 타고파 Ag 123

적용하는 법

HTML head에 아래를 붙이면 끝입니다. 폰트 파일을 내려받거나 서버에 올릴 필요는 없습니다.

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&display=swap">

<style>
  body { font-family: "Nanum Gothic", sans-serif; }
</style>
  1. 위 link 태그를 <head> 안에 넣는다.
  2. CSS에서 font-family: "Nanum Gothic", sans-serif;로 지정한다.
  3. 폰트를 받는 동안 쓸 대체 폰트를 뒤에 남겨 둔다. 지우면 로딩 중 글자가 안 보인다.

이럴 때 쓴다

공공기관, 병원, 학교처럼 신뢰감이 우선인 사이트. 나이 든 사용자에게 가장 익숙한 글자 모양이다.

이럴 땐 다른 걸 쓴다

스타트업 랜딩. 2010년대 웹사이트 인상이 강하게 남는다.

같이 쓰면 좋은 폰트: 나눔명조

같은 고딕 계열: 프리텐다드 · 수트 · 본고딕 · IBM 플렉스 산스 KR · 고운돋움

정보

영문 이름Nanum Gothic
CSS font-familyNanum Gothic
굵기400, 700, 800 (3종)
가변 폰트아니오 — 굵기마다 파일 하나
라이선스OFL 1.1
배포Google Fonts
공식 페이지https://fonts.google.com/specimen/Nanum+Gothic

자주 묻는 질문

나눔고딕(Nanum Gothic)을 상업적으로 써도 되나요?

OFL 1.1이라 상업적 사용과 수정, 재배포가 허용됩니다. 폰트 파일 자체를 파는 것만 금지됩니다. 계약이 걸린 작업이라면 공식 페이지에서 원문을 확인하세요.

나눔고딕은 굵기가 몇 종인가요?

3종입니다(400, 700, 800). 가변 폰트가 아니라 굵기 하나마다 파일이 하나씩 늘어납니다. 실제로 쓸 굵기만 고르세요.

나눔고딕은 어디에 쓰면 안 되나요?

스타트업 랜딩. 2010년대 웹사이트 인상이 강하게 남는다.

← 폰트 26종 전체 보기