디자인 아틀라스
EN
Aa 타이포그래피

네모꼴과 탈네모꼴

Square-form vs free-form Hangul

대부분의 한글 글꼴은 음절마다 똑같은 네모 틀 안에 맞춰 그리는 "네모꼴"입니다. 이 틀을 깨고 자모를 라틴 알파벳처럼 자유로운 높이·위치로 흘려보내는 실험을 "탈네모꼴"이라 부릅니다.

다른 이름: 네모틀Squared vs unbound Hangul탈네모꼴 글꼴
···
html
<div class="stage">
  <div class="panel">
    <div class="box"><span class="ch">한</span></div>
    <div class="tag">네모꼴 — 정사각형 틀에 맞춤</div>
  </div>
  <div class="panel">
    <svg viewBox="0 0 100 100" class="sketch">
      <line pathLength="100" x1="20" y1="78" x2="20" y2="20" class="s s1"/>
      <line pathLength="100" x1="20" y1="20" x2="55" y2="12" class="s s2"/>
      <circle pathLength="100" cx="72" cy="38" r="12" class="s s3"/>
      <line pathLength="100" x1="28" y1="92" x2="82" y2="92" class="s s4"/>
    </svg>
    <div class="tag">탈네모꼴 — 자모가 틀을 벗어남 (단순화한 스케치)</div>
  </div>
</div>
css
.stage{display:flex;gap:24px;align-items:center;justify-content:center;flex-wrap:wrap;padding:0 8px}
.panel{display:grid;gap:8px;justify-items:center}
.box{width:15vmin;height:15vmin;min-width:56px;min-height:56px;border:2px dashed var(--line);border-radius:6px;display:grid;place-items:center;animation:glow 2.2s ease-in-out infinite}
@keyframes glow{0%,100%{border-color:var(--line)}50%{border-color:var(--accent)}}
.ch{font:800 8vmin/1 -apple-system,system-ui,"Apple SD Gothic Neo",sans-serif;color:var(--fg)}
.sketch{width:15vmin;height:15vmin;min-width:56px;min-height:56px;overflow:visible}
.s{fill:none;stroke-width:6;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;animation:draw 3.2s ease-in-out infinite}
.s1{stroke:var(--accent-2)}
.s2{stroke:var(--accent-2);animation-delay:.25s}
.s3{stroke:var(--accent);animation-delay:.5s}
.s4{stroke:var(--accent-3);animation-delay:.75s}
@keyframes draw{0%{stroke-dashoffset:100}35%,80%{stroke-dashoffset:0}100%{stroke-dashoffset:100}}
.tag{font:10px ui-monospace,Menlo,monospace;color:var(--muted);text-align:center;max-width:22vmin}

네모꼴은 활판 인쇄 시대부터 이어진 관행입니다. 각 음절이 정확히 같은 크기의 정사각형 칸에 들어가야 활자를 조판하기 쉬웠고, 그 결과 초성·중성·종성의 실제 크기는 받침 유무나 모음 방향에 따라 매번 미세하게 재조정됩니다 — "가"의 ㄱ과 "각"의 ㄱ은 같은 글자지만 실제로는 다른 크기로 그려집니다.

1980~90년대 안상수 등 일부 타이포그래퍼는 이 틀을 의문시하며, 자모를 고정된 정사각형이 아니라 각자 고유한 폭·높이를 유지한 채 라틴 알파벳처럼 기준선(베이스라인)에 맞춰 흘려 쓰는 실험적 글꼴을 시도했습니다. 가독성보다 조형적 실험에 가까웠고 본문 서체로 널리 쓰이지는 않았지만, 한글 타이포그래피의 규칙을 재검토하게 만든 시도로 남아 있습니다.

이 사이트는 외부 폰트를 불러올 수 없어 실제 탈네모꼴 글꼴 대신, SVG 선으로 네모꼴(정사각형 틀 안에 맞춘 형태)과 자모가 틀을 벗어나 제각각 높이로 흩어진 단순화된 탈네모꼴 스케치를 나란히 그려 개념 차이를 보여줍니다. 실제 서체의 정교함과는 다른, 개념을 위한 단순화입니다.

언제 쓰나

실무 UI·본문에는 네모꼴(대부분의 시스템 폰트)을 그대로 쓰세요. 탈네모꼴은 실험적 브랜딩·아트 디렉션처럼 관습을 의도적으로 깨고 싶을 때만 검토합니다.