한글 페어링 · 큐레이션

비트로 코어+코트라 도약

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

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

A:비트로 코어· 제작 비트로|B:코트라 도약· 제작 코트라

→ 각 폰트 종합 가이드: 비트로 코어 가이드·코트라 도약 가이드

평가 결과 · 2개 케이스

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

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

58제목 비트로 코어 · 본문 코트라 도약

비트로 코어B=제목용ⓘ 미리보기는 프리텐다드

제작비트로상업 무료다운로드

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

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

오늘의 문장이 내일의 방향을 만든다

코트라 도약은 자형이 또렷해 중장문 본문에 안정적이며, 비트로 코어는 조형성이 강해 짧은 헤드라인에만 적합합니다.

분위기: 코트라 도약의 정제된 세리프 흐름이 본문을 차분히 받치고, 비트로 코어의 기하학적 디스플레이가 제목에서 강한 액센트를 만듭니다.
대비·계층: 세리프 본문과 디스플레이 제목이라는 분류 자체의 대비는 크지만, 두 폰트 모두 400 웨이트라 위계 강화를 위해 사이즈·색상 차이를 적극 활용해야 합니다.
추천 용도: 문화 기획 매거진 본문전시·포스터 캡션과 헤드라인브랜드 캠페인 롱폼 콘텐츠리포트형 출판물

어울리는 영문 폰트

제목GeistManropePlus Jakarta Sans

본문Source SerifLora

본문 세리프에는 같은 결의 세리프 라틴을 매칭해 텍스트 흐름을 유지하고, 제목 디스플레이에는 기하학적이고 모던한 산세리프를 합성해 비트로 코어의 조형성과 호응시킵니다.

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

44~56px

26~30px

본문

16~18px

line-height

1.7

어울리는 색상

#1f1b16

#c8552d

#f3ece1

어울리는 산업 톤

라이프스타일 매거진문화예술 기획출판 리포트

42제목 코트라 도약 · 본문 비트로 코어

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

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

+비트로 코어A=본문용ⓘ 미리보기는 프리텐다드

제작비트로상업 무료다운로드

오래된 화면 속, 잊혀진 문장을 다시 켜다.

비트로 코어는 디스플레이 성격이라 본문으로 길게 흘리면 픽셀 질감 때문에 피로도가 빠르게 올라갑니다. 코트라 도약 제목은 또렷하지만 본문이 가독성을 못 받쳐줍니다.

분위기: 비트로 코어가 픽셀·레트로 디지털 톤을 본문으로 끌고 가는데, 코트라 도약의 클래식한 세리프 제목과 시대감이 충돌합니다. 디지털 노스탤지어와 정통 출판 무드가 한 화면에서 부딪쳐 일관성이 약합니다.
대비·계층: 세리프 제목 vs 픽셀 본문이라는 구조 대비는 강하지만, 위계라기보다 양식 충돌에 가까워 정보 흐름이 매끄럽지 않습니다.
추천 용도: 레트로 게임 매뉴얼 표지+속지디지털 헤리티지 전시 도록8비트 컨셉 이벤트 포스터 캡션복고풍 IT 매거진 단편 기획

어울리는 영문 폰트

제목EB GaramondSource SerifPlayfair Display

본문VT323Geist Mono

제목 코트라 도약은 정통 세리프와 자연스럽게 합쳐지고, 비트로 코어 본문은 모노·픽셀 계열 라틴과 짝지어야 톤이 유지됩니다.

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

32~40px

22~26px

본문

15~17px

line-height

1.7

어울리는 색상

#1a1a1a

#d4a017

#f3ede2

어울리는 산업 톤

레트로 게이밍 컬처디지털 아카이브 전시복고풍 인디 매거진

구현 코드 · 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;
}