한글 페어링 · 큐레이션

코트라 도약+본고딕

두 한글 폰트의 큐레이션·점수화 페어링. 어울리는 영문 폰트, 권장 사이즈, 색상 팔레트, 산업 톤까지 한 페이지에서.

평가 케이스: 2개
평균 점수: 79점
관련 페어: 6개

A:코트라 도약· 제작 코트라|B:본고딕· 제작 어도비·구글

→ 각 폰트 종합 가이드: 코트라 도약 가이드·본고딕 가이드

평가 결과 · 2개 케이스

제목·본문 컨텍스트별 페어 분석

점수, 어울리는 영문 폰트, 권장 크기, 색상 팔레트를 케이스별로.

86제목 코트라 도약 · 본문 본고딕

코트라 도약A=제목용ⓘ 미리보기는 프리텐다드

제작코트라상업 무료다운로드

+본고딕B=본문용ⓘ 미리보기는 프리텐다드

제작어도비·구글상업 무료다운로드

도약하는 대한민국, 세계로 뻗다

코트라 도약은 굵은 획과 또렷한 구조로 헤드라인에서 시선을 단숨에 잡고, 본고딕은 다양한 웨이트와 정제된 자형으로 긴 본문에서도 가독성이 매우 안정적이다.

분위기: 코트라 도약의 강건하고 진취적인 세리프가 제목을 묵직하게 끌고, 본고딕의 균형 잡힌 산세리프가 본문을 차분히 받쳐 신뢰감 있는 톤을 만든다.
대비·계층: 세리프 제목과 산세리프 본문이라는 분류 차이에 더해 코트라 도약 특유의 강한 인상과 본고딕 Regular의 중성적 톤이 명확한 위계를 만든다.
추천 용도: 공공기관 리포트 표지B2B 기업 IR·연차보고서산업·무역 매거진 특집정책 브리핑 웹페이지전시·세미나 키비주얼

어울리는 영문 폰트

제목Source SerifIBM Plex SerifMerriweatherEB Garamond

본문Source Sans ProIBM Plex SansInter

코트라 도약의 진중한 세리프 인상은 Source Serif 계열과 구조가 맞고, 본고딕은 같은 어도비 패밀리인 Source Sans Pro와 합성 시 자폭·웨이트가 자연스럽게 호환된다.

권장 사이즈 (한국어 기준)

40~52px

24~30px

본문

16~18px

line-height

1.7

어울리는 색상

#1a2a44

#c8a96a

#f5f1ea

어울리는 산업 톤

공공기관 신뢰B2B 무역·산업정책·리서치 리포트기업 IR 모던

72제목 본고딕 · 본문 코트라 도약

본고딕A=제목용ⓘ 미리보기는 프리텐다드

제작어도비·구글상업 무료다운로드

+코트라 도약B=본문용ⓘ 미리보기는 프리텐다드

제작코트라상업 무료다운로드

글로벌 시장의 새로운 기준을 제시합니다

본고딕은 다양한 웨이트로 제목 위계를 또렷이 잡아주며, 코트라 도약은 한 가지 웨이트지만 획 대비가 분명해 중장문 본문에서도 읽힘이 유지된다.

분위기: 본고딕의 정제된 중립감이 제목에서 안정적인 토대를 만들고, 코트라 도약의 묵직한 세리프가 본문에 무게감과 진중함을 더한다.
대비·계층: 산세리프 제목과 세리프 본문이라는 분류 대비가 명확하고, 본고딕 700~900과 코트라 도약 400의 웨이트 격차가 계층을 분명히 만든다.
추천 용도: 공공기관 리포트B2B 백서·IR 자료수출입·무역 브로셔정책 브리핑 웹페이지기업 연차보고서

어울리는 영문 폰트

제목InterIBM Plex SansManropeHelvetica Neue

본문Source SerifIBM Plex SerifMerriweather

본고딕은 어도비 합작인 만큼 Source 계열·Inter처럼 중립 산세리프와 구조가 잘 맞고, 코트라 도약은 묵직한 세리프 본문에 어울리는 Source Serif·IBM Plex Serif와 톤이 일치한다.

권장 사이즈 (한국어 기준)

36~44px

24~28px

본문

16~18px

line-height

1.65

어울리는 색상

#1a2a44

#c8a96a

#f4f1ea

어울리는 산업 톤

공공기관 신뢰B2B 무역·수출정책 리포트금융 보수

구현 코드 · CSS

즉시 적용 가능한 CSS 코드

폰트의 공식 CDN을 자동 매핑. 그대로 복사해서 프로젝트에 붙여 넣으세요.

/* 코트라 도약 또는 본고딕의 공식 CDN이 없어 Pretendard로 fallback 처리 */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/variable/pretendardvariable.min.css');

/* 제목 */
h1, h2, h3 {
  font-family: 'Pretendard Variable', sans-serif;
}

/* 본문 */
body, p {
  font-family: 'Pretendard Variable', sans-serif;
}