한글 페어링 · 큐레이션

한컴 말랑말랑+JS 동까비

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

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

A:한컴 말랑말랑· 제작 한컴|B:JS 동까비· 제작 정스튜디오

→ 각 폰트 종합 가이드: 한컴 말랑말랑 가이드·JS 동까비 가이드

평가 결과 · 2개 케이스

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

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

74제목 JS 동까비 · 본문 한컴 말랑말랑

JS 동까비A=제목용ⓘ 미리보기는 프리텐다드

제작정스튜디오상업 무료

+한컴 말랑말랑B=본문용ⓘ 미리보기는 프리텐다드

제작한컴상업 무료다운로드

오늘은 달콤한 하루를 선물할게요

JS 동까비는 디스플레이 폰트라 짧은 제목에서 시선을 끌고, 한컴 말랑말랑은 둥근 곡선과 안정적인 자폭으로 중단문 본문까지 무난히 읽힙니다.

분위기: JS 동까비의 장난기 있는 손글씨 인상과 한컴 말랑말랑의 둥글고 부드러운 본문 분위기가 친근하고 말랑한 톤으로 자연스럽게 이어집니다.
대비·계층: 제목의 손글씨적 불규칙성과 본문의 정돈된 둥근 산세리프가 형태 대비를 만들지만, 두 폰트 모두 라운드 톤이라 위계는 사이즈·웨이트로 보강해야 합니다.
추천 용도: 어린이·교육 콘텐츠 배너F&B 메뉴판·패키지라이프스타일 SNS 카드뉴스캐주얼 이벤트 포스터

어울리는 영문 폰트

제목FrauncesCaveatPlayfair DisplayManrope

본문NunitoQuicksandPlus Jakarta Sans

제목엔 손글씨 뉘앙스나 곡선이 살아있는 라틴이 동까비와 톤을 맞추고, 본문은 둥근 터미널을 가진 sans가 말랑말랑의 라운드 형태와 자연스럽게 합성됩니다.

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

40~52px

24~30px

본문

16~18px

line-height

1.65

어울리는 색상

#ff7a59

#ffd56b

#fff7ec

어울리는 산업 톤

교육 따뜻F&B 친근라이프스타일 캐주얼

42제목 한컴 말랑말랑 · 본문 JS 동까비

한컴 말랑말랑A=제목용ⓘ 미리보기는 프리텐다드

제작한컴상업 무료다운로드

+JS 동까비B=본문용ⓘ 미리보기는 프리텐다드

제작정스튜디오상업 무료

말랑말랑한 하루, 기분 좋은 시작

말랑말랑은 제목에서 친근하게 읽히지만, 디스플레이 성격인 JS 동까비를 본문에 쓰면 긴 문장 가독성이 급격히 떨어집니다.

분위기: 한컴 말랑말랑의 둥글고 부드러운 인상이 JS 동까비의 장난기 있는 디스플레이 형태와 만나 캐주얼한 톤을 만들지만, 두 폰트 모두 개성이 강해 시각적 충돌 위험이 있습니다.
대비·계층: 둘 다 부드러운 라운드 계열이라 형태 대비가 약하고, 본문이 디스플레이 폰트라 위계가 오히려 역전되어 보일 수 있습니다.
추천 용도: 어린이 콘텐츠 표지캐주얼 이벤트 포스터굿즈·스티커 패키지SNS 짧은 카피

어울리는 영문 폰트

제목QuicksandNunitoBaloo 2

본문Nunito SansSource Sans Pro

말랑말랑의 둥근 라운드 골격에 맞춰 Quicksand·Nunito 같은 라운드 산세리프가 자연스럽게 어울립니다. 본문에는 좀 더 차분한 Nunito Sans·Source Sans Pro로 균형을 맞춥니다.

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

36~44px

22~26px

본문

16~18px

line-height

1.7

어울리는 색상

#ff8fa3

#ffd66b

#fff8ec

어울리는 산업 톤

키즈·교육 친근F&B 캐주얼라이프스타일 굿즈

구현 코드 · CSS

즉시 적용 가능한 CSS 코드

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

/* 한컴 말랑말랑 또는 JS 동까비의 공식 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;
}