# TrueType QR Code 폰트 - 폰트만으로 QR코드 만들기

> Clean Markdown view of GeekNews topic #31247. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=31247](https://news.hada.io/topic?id=31247)
- GeekNews Markdown: [https://news.hada.io/topic/31247.md](https://news.hada.io/topic/31247.md)
- Type: GN+
- Author: [neo](https://news.hada.io/@neo)
- Published: 2026-07-09T09:07:05+09:00
- Updated: 2026-07-09T09:07:05+09:00
- Original source: [qr.jim.sh](https://qr.jim.sh/)
- Points: 4
- Comments: 2

## Topic Body

- **대괄호로 감싼 텍스트**를 QR 코드로 바꾸는 TrueType/OpenType 폰트로, 이미지 생성 없이 문서 안에 QR 코드를 넣을 수 있음  
- 변환은 폰트 내부의 **OpenType 규칙**이 처리하며, 대괄호 밖 텍스트는 일반 라틴 텍스트로 그대로 표시됨  
- QR 코드 블록도 텍스트로 남기 때문에 **복사·붙여넣기**, 평문 저장, 일반 문장과의 인라인 배치가 가능함  
- 브라우저가 셰이핑 전에 줄바꿈을 결정하므로 공백·점·슬래시 같은 지점에서 QR 코드가 **여러 줄로 쪼개질 수 있음**  
- HTML에서 안정적으로 보이게 하려면 대괄호 블록을 `white-space: nowrap;` 또는 `display: inline-block;`가 적용된 컨테이너로 감싸야 함  
  
---  
  
### 폰트가 QR 코드를 만드는 방식  
- **Jim's TrueType QR Code Font**는 실제 TrueType/OpenType 폰트이며, `[hello]`처럼 입력한 대괄호 안 텍스트를 QR 코드로 렌더링함  
- QR 코드 생성은 폰트 안의 **OpenType 규칙**으로 처리되어 별도 이미지 생성이나 전처리 단계가 필요 없음  
- 대괄호 밖의 텍스트는 읽을 수 있는 일반 라틴 텍스트로 남음  
- 대괄호 안에는 **출력 가능한 ASCII**를 사용해야 함  
- 폰트별 지원 길이는 다음과 같음  
  - QR Font 1-L: 블록당 최대 17자  
  - QR Font 2-L: 블록당 최대 32자  
  - QR Font 3-L: 블록당 최대 53자  
  - Plain Sans: QR 파싱 없음  
- 일반 텍스트는 Liberation Sans에서 파생된 글꼴로 표시됨  
  
### 텍스트로 남는 QR 코드와 표시 주의점  
- QR 코드가 텍스트로 유지되므로 렌더링된 QR 블록을 일반 문자처럼 복사·붙여넣기하거나, 평문으로 저장하거나, 라틴 텍스트와 인라인으로 섞을 수 있음  
- 브라우저 레이아웃 엔진은 셰이핑 전에 유니코드 텍스트 기준으로 줄바꿈을 수행함  
  - 공백, 점, 슬래시처럼 줄바꿈 가능한 문자가 있고 텍스트 컨테이너 끝에 닿으면 QR 코드가 여러 줄로 나뉠 수 있음  
  - HTML에서는 대괄호 블록을 `white-space: nowrap;` 또는 `display: inline-block;` 스타일이 적용된 컨테이너로 감싸야 안정적으로 렌더링됨  
- 다운로드와 소스  
  - [Download QR Font 1-L](https://qr.jim.sh/qrfont-1L.ttf?h=263173ec)  
  - [Download QR Font 2-L](https://qr.jim.sh/qrfont-2L.ttf?h=1447aaa7)  
  - [Download QR Font 3-L](https://qr.jim.sh/qrfont-3L.ttf?h=9eac9e2c)  
  - [Source repository](https://github.com/jimparis/qr-font)

## Comments



### Comment 61465

- Author: xguru
- Created: 2026-07-09T09:50:42+09:00
- Points: 1

이거 좋군요. 언젠가 쓸모가 있을거 같아요.   
긱뉴스에 도입하면 어떨까 싶은데 적합한 사용처를 모르겠네요.  
  
텍스트 기반에 적합한 것들은 긱뉴스에 계속 도입중입니다.  
  
[Datatype - 텍스트를 차트로 변환하는 가변 폰트](https://news.hada.io/topic?id=29640)  
[구글, 흑백 이모지 폰트 Noto Emoji 공개](https://news.hada.io/topic?id=6473)

### Comment 61456

- Author: neo
- Created: 2026-07-09T09:07:07+09:00
- Points: 1

###### [Lobste.rs 의견들](https://lobste.rs/s/y0tvll/jim_s_truetype_qr_code_font) 
- QR 코드에서 **내용이 어디에 인코딩되는지** 보여주는 방식이 좋음. 오른쪽 아래에서 시작해 위아래로 지그재그로 움직이며 오른쪽에서 왼쪽으로 채워지는 흐름이 드러남  
  다만 그 목적이라면 위치/정렬/타이밍 마커가 `]`를 기다리지 말고 `[`에서 바로 채워졌으면 구성 과정을 더 잘 볼 수 있었을 듯함. 물론 `]`에서 처리하면 이상한 중간 상태나 너무 긴 값이 코드로 오인되는 일을 피할 수 있다는 점도 이해됨

- 멋짐. 최근 사업에 쓰던 QR 코드가 **유료 QR 코드 생성기** 뒤에서 납치되는 사기를 당했음  
  더 조심했어야 했지만, 웹 기반 JavaScript QR 인코더와 사기성 QR 서비스를 구분하기 어려웠음. 이런 열린 선택지가 검색엔진 최적화를 더 잘해서, 꼭 잘 알아야만 하는 건 아닌 사람들도 사기를 피할 수 있으면 좋겠음
  - 보통 **JavaScript QR 생성 라이브러리**를 검색한 뒤 GitHub에서 데모 페이지로 들어감 :p
  - QR 코드는 한 번도 스캔해 본 적 없음. 식당이 메뉴를 보려면 QR 코드가 필요하다고 하면 그냥 나감
  - GHCQ의 **CyberChef**를 쓰면 됨. 내려받을 수 있는 웹 페이지임

- 아, **OpenType**이 튜링 완전하다는 걸 생각하면 예상했어야 했음
  - 도전 과제: 어떻게든 **OpenType에서 Doom**을 실행해 보기

- 사이트가 잠깐 자체 글꼴을 설정하도록 허용하는 **임시 버튼**이 있으면 좋겠음

- 나만 그런 건지 모바일에서는 안 되는 듯함. 선택 상자에서 어떤 글꼴을 골라도 둘 다 일반 텍스트로 보임  
  Android의 Brave 브라우저에서 확인함
  - 참고로 iOS Safari에서는 잘 작동함
  - Android의 Firefox에서는 작동함. Chrome은 없어서 확인 못 함

- QR 내용의 텍스트를 복사할 수 있는 기능이 Chrome에서 깨진 듯함. 개인적으로는 멋진 **OpenType 해킹**을 제외하면 이게 가장 큰 장점처럼 보이는데, QR 자체를 선택해서 복사하면 닫는 대괄호만 나옴
  - 같은 현상을 봤음. **더블 클릭**이 선택하는 범위의 문제에 더 가까워 보임  
    선택 영역을 끌어서 QR 전체를 확실히 포함시키면 전체 텍스트도 함께 복사됨