한글 페어링 · 큐레이션

배달의민족 한나는열한살+본고딕

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

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

A:배달의민족 한나는열한살· 제작 우아한형제들|B:본고딕· 제작 어도비·구글

→ 각 폰트 종합 가이드: 배달의민족 한나는열한살 가이드·본고딕 가이드

평가 결과 · 2개 케이스

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

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

82제목 배달의민족 한나는열한살 · 본문 본고딕

배달의민족 한나는열한살A=제목용

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

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

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

오늘 점심 뭐 먹지, 같이 골라봐요

한나는열한살은 큰 사이즈에서 개성이 살아나 시선을 끌고, 본고딕은 다양한 웨이트로 긴 본문에서도 안정적인 가독성을 제공한다.

분위기: 한나는열한살의 손글씨풍 친근함이 본고딕의 정제된 모던함과 만나 따뜻하면서도 신뢰감 있는 톤을 만든다.
대비·계층: 디스플레이 손글씨와 기하학 산세리프라는 분류 대비, 그리고 본고딕의 풍부한 웨이트 폭이 명확한 정보 위계를 형성한다.
추천 용도: F&B 브랜드 캠페인 페이지이벤트·프로모션 랜딩어린이·교육 콘텐츠라이프스타일 매거진 헤드라인

어울리는 영문 폰트

제목FrauncesCaveatDM Serif Display

본문InterIBM Plex Sans

한나의 손글씨 톤은 약간의 굴곡감을 가진 디스플레이 세리프나 캐주얼 스크립트와 합이 좋고, 본문은 중립적이고 검증된 산세리프가 본고딕의 인상과 자연스럽게 이어진다.

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

44~56px

26~30px

본문

16~17px

line-height

1.7

어울리는 색상

#2bc4b6

#ffd23f

#fff8ec

어울리는 산업 톤

F&B 친근이커머스 캠페인교육 따뜻

58제목 본고딕 · 본문 배달의민족 한나는열한살

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

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

+배달의민족 한나는열한살B=본문용

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

본고딕이 또렷이 잡아주는 제목 한 줄

제목인 본고딕은 다양한 웨이트로 어느 사이즈에서도 또렷하게 읽힌다. 한나는열한살은 본문용이 아니므로 짧은 카피·캡션에 한정해야 가독성이 유지된다.

분위기: 본고딕의 정제된 산세리프 인상이 한나는열한살의 손글씨 같은 캐주얼함과 만나 친근하면서도 정돈된 톤을 만든다. 다만 본문에 디스플레이 폰트를 쓰는 구조라 톤 균형이 까다롭다.
대비·계층: 본고딕 Bold·Black의 기하학적 직선성과 한나는열한살의 둥글고 손맛 있는 형태가 강한 대비를 만들어 위계는 분명하다. 다만 두 폰트 모두 개성이 있어 자칫 충돌할 수 있다.
추천 용도: F&B 브랜드 키비주얼이벤트·프로모션 페이지캐주얼 패키지 카피SNS 카드뉴스 헤더팝업스토어 사이니지

어울리는 영문 폰트

제목InterIBM Plex SansHelvetica NeueManrope

본문Plus Jakarta SansSatoshi

본고딕의 중립적 기하 산세리프 톤은 Inter·Plex Sans처럼 균형 잡힌 라틴과 자연스럽게 합성된다. 한나는열한살의 캐주얼한 무드는 살짝 둥글고 친근한 Jakarta·Satoshi가 받아준다.

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

36~44px

22~26px

본문

16~18px

line-height

1.7

어울리는 색상

#1a1a1a

#ffb547

#f7f3ec

어울리는 산업 톤

F&B 친근이커머스 캐주얼라이프스타일 매거진

구현 코드 · CSS

즉시 적용 가능한 CSS 코드

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

@import url('https://cdn.jsdelivr.net/gh/fonts-archive/BMHANNA11yrs/subsets/BMHANNA11yrs-dynamic-subset.css');

/* 제목 */
h1, h2, h3 {
  font-family: 'BM HANNA 11yrs', sans-serif;
}

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