한글 페어링 · 큐레이션

주아+코트라 희망

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

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

A:주아· 제작 우아한형제들|B:코트라 희망· 제작 코트라

→ 각 폰트 종합 가이드: 주아 가이드·코트라 희망 가이드

평가 결과 · 2개 케이스

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

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

42제목 코트라 희망 · 본문 주아

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

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

+주아A=본문용

제작우아한형제들상업 무료다운로드

공공 서비스와 친근함을 함께 전달하기 어렵습니다.

주아는 디스플레이 폰트로 설계되어 긴 본문 읽기에 부적합하며, 낮은 x-height와 큰 자간으로 인해 가독성이 떨어집니다. 코트라 희망은 serif 구조로 본문 폰트 역할을 할 수 있으나, 제목으로 사용하기에는 무게감이 부족합니다.

분위기: 주아의 둥글고 친근한 sans-serif 디스플레이 톤과 코트라 희망의 정중한 serif 톤이 충돌하여 일관된 분위기 형성이 어렵습니다. 주아는 캐주얼·장난스러운 인상이고, 코트라 희망은 공식·신뢰 지향적이어서 톤 매칭이 불안정합니다.
대비·계층: 두 폰트 모두 400 weight로 동일하여 명확한 시각적 대비가 없습니다. sans vs serif 구조 차이만으로는 정보 위계를 충분히 표현하기 어렵습니다.
추천 용도: 공공기관 공식 문서 (코트라 희망의 신뢰도)캐주얼 이벤트 포스터 (주아의 친근함)혼합 톤이 필요한 특수 편집 디자인

어울리는 영문 폰트

제목IBM Plex SerifSource SerifLora

본문InterSource Sans Pro

주아의 캐주얼 톤을 보완하려면 serif 영문 폰트(IBM Plex Serif)가 격식을 더하고, 코트라 희망의 공식성을 지지하는 sans(Inter)와 균형을 맞출 수 있습니다.

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

32~40px

20~24px

본문

16~18px

line-height

1.65

어울리는 색상

#1a1a1a

#d4a574

#f5f1ed

어울리는 산업 톤

공공기관 신뢰캐주얼 라이프스타일

42제목 주아 · 본문 코트라 희망

주아B=제목용

제작우아한형제들상업 무료다운로드

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

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

희망의 메시지를 전하는 따뜻한 디자인

코트라 희망은 본문용 세리프로 긴 글 읽기에 적합하나, 주아는 디스플레이 특화로 제목 가독성은 우수하지만 제목-본문 간 시각적 위계 전환이 급격하다.

분위기: 코트라 희망의 세리프 우아함과 주아의 둥근 디스플레이 산스가 분위기 충돌을 일으킨다. 세리프 본문 폰트는 격식·신뢰를 전달하지만, 주아의 친근하고 장난스러운 톤이 이를 약화시킨다.
대비·계층: 무게(weight)가 모두 400으로 동일하여 제목과 본문 간 명확한 대비가 부족하다. 산스-세리프 구조 차이만으로는 정보 위계가 약하다.
추천 용도: 아동·교육 콘텐츠 (주아의 친근함 활용)캐주얼 웹진·블로그 (세리프 본문의 읽기성)공공기관 소식지 (제한적)

어울리는 영문 폰트

제목ManropePlus Jakarta SansGeist

본문Source Serif ProLora

주아의 둥근 산스 톤에는 현대적 산스(Manrope, Geist)가 어울리고, 코트라 희망 세리프 본문에는 따뜻한 세리프(Source Serif Pro, Lora)가 조화롭다.

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

36~44px

20~26px

본문

16~18px

line-height

1.65

어울리는 색상

#2c2c2c

#d4a574

#f9f6f1

어울리는 산업 톤

공공기관 신뢰교육 따뜻

구현 코드 · CSS

즉시 적용 가능한 CSS 코드

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

@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');

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

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