본문 바로가기

정보를 입력하면
QR 코드가 생성됩니다

정보 입력

QR 유형 선택

기본

스마트폰

소셜

결제


온라인 QR 코드 생성기

1. "무료라면서요..." 결제창 앞에서 뒤로가기를 눌러본 당신에게

"무료 QR 코드 만들기"를 검색해 본 적 있으신가요? 마음에 드는 색상을 고르고, 가운데에 로고까지 딱 넣은 뒤 '다운로드' 버튼을 누르는 순간! 갑자기 회원가입 창이 뜨거나 고화질(SVG) 다운로드는 유료라는 결제창을 마주한 경험, 다들 한 번쯤 있으실 겁니다.

어찌저찌 무료 버전을 다운받아 포스터에 넣었더니, 인쇄했을 때 화질이 깨져서 바코드 인식이 안 되는 대참사가 벌어지기도 하죠. 기껏해야 링크 하나 연결하는 흑백 사각형일 뿐인데, 왜 이렇게 번거롭고 숨겨진 조건이 많은 걸까요?

이 QR 코드 생성기는 바로 그 답답함에서 출발했습니다. 결제 유도도, 귀찮은 회원가입도 없습니다. 브라우저 창 하나만 열면 누구나 고화질의 맞춤형 QR 코드를 10초 만에 만들어갈 수 있습니다.

 

a. 생각보다 넓은 QR 코드의 활용 범위

QR 코드는 단순히 URL을 담는 흑백 사각형이 아닙니다. 일반 텍스트, 이메일 주소, WiFi 접속 정보, 전화번호, vCard 연락처 등 다양한 데이터 유형을 인코딩할 수 있습니다. 오프라인과 온라인을 연결하는 가장 낮은 마찰의 인터페이스라고 할 수 있습니다.

b. 브라우저 탭 하나로 끝내는 QR 코드 생성기

이 도구는 별도의 설치나 회원가입 없이 브라우저에서 바로 QR 코드를 생성할 수 있습니다. 플랫폼별 맞춤 템플릿, 커스텀 디자인, 로고 삽입, 고해상도 내보내기까지 — 실무에서 필요한 기능을 한 화면에 담았습니다.

 


2. QR 코드 생성기 사용 방법

a. 주요 기능 및 예시

이 도구는 단순한 데이터 변환을 넘어 사용자 맞춤형 디자인과 다양한 플랫폼 규격을 지원합니다.

  • 플랫폼별 맞춤형 템플릿: 카카오톡 채널, 인스타그램, 유튜브, WiFi 연결 등 주요 소셜 미디어와 서비스에 최적화된 입력 양식을 제공합니다.
    • 예시: "카카오톡 채널 아이디를 입력하면 해당 채널로 바로 연결되는 전용 QR 코드가 생성됩니다."
  • 커스텀 디자인 스타일링: QR 코드를 구성하는 점과 모서리 마커의 모양을 사각형, 원형, 클래식 등 다양한 스타일로 변경할 수 있습니다.
    • 예시: "기본 사각형 형태에서 'Extra-rounded' 옵션을 선택하여 부드러운 원형 디자인의 QR 코드를 만듭니다."
  • 로고 삽입 기능: QR 코드 중앙에 서비스 로고나 사용자 이미지를 삽입하여 브랜드 인지도를 높일 수 있습니다.
    • 예시: "회사 로고 PNG 파일을 업로드하여 QR 코드 중심부에 배치합니다."
  • 색상 및 그라데이션 적용: 단색 배경 및 패턴 색상뿐만 아니라 두 가지 색상을 조합한 그라데이션 효과를 적용할 수 있습니다.
    • 예시: "검정색 패턴 대신 파란색과 보라색이 섞인 그라데이션을 적용하여 가독성과 심미성을 동시에 확보합니다."
  • 고해상도 파일 내보내기: 생성된 QR 코드를 손실 없는 벡터 형식인 SVG 또는 범용적인 PNG 파일로 다운로드할 수 있습니다.
    • 예시: "인쇄물 제작을 위해 크기 조절이 자유로운 SVG 형식으로 결과물을 저장합니다."

b. 사용 단계

  1. 유형 선택: 왼쪽의 'QR 유형 선택' 패널에서 URL, 이메일, WiFi, 카카오톡 등 원하는 데이터의 종류를 선택합니다.
  2. 정보 입력 및 디자인 수정: 중앙의 입력창에 필요한 정보를 기입합니다. 필요한 경우 QR 코드 위로 마우스를 올려 '디자인 수정' 버튼을 클릭한 뒤 색상과 로고를 설정합니다.
  3. 파일 저장: 화면 우측 상단의 'PNG' 또는 'SVG' 버튼을 클릭하여 생성된 QR 코드 이미지를 내보냅니다.

 


3. QR 코드, 그 안에는 무엇이 들어 있는가

a. QR 코드의 탄생 배경

QR 코드(Quick Response Code)는 1994년 일본의 덴소 웨이브(Denso Wave)가 개발한 2차원 매트릭스 바코드입니다. 기존 1차원 바코드가 최대 20자 남짓의 데이터만 담을 수 있었던 반면, QR 코드는 숫자 최대 7,089자, 영숫자 4,296자, 바이너리 2,953바이트를 저장할 수 있습니다. 자동차 부품 추적을 위해 만들어졌지만, 지금은 모바일 결제부터 출입 인증까지 일상 전반에 스며들었습니다.

b. QR 코드의 물리적 구조

QR 코드를 자세히 들여다보면, 단순한 흑백 점 배열이 아니라 각 영역마다 역할이 명확히 구분되어 있습니다.

구성 요소역할위치
파인더 패턴 (Finder Pattern)스캐너가 QR 코드의 위치와 방향을 인식좌상단, 우상단, 좌하단 세 모서리
얼라인먼트 패턴 (Alignment Pattern)기울어진 각도에서도 정확히 읽히도록 보정버전 2 이상에서 내부에 배치
타이밍 패턴 (Timing Pattern)모듈 좌표를 파악하는 기준선파인더 패턴 사이를 잇는 가로·세로 줄
포맷 정보 (Format Information)오류 정정 레벨과 마스크 패턴 저장파인더 패턴 주변
데이터 및 오류 정정 영역실제 인코딩된 데이터와 복원용 코드나머지 전체 영역
콰이어트 존 (Quiet Zone)주변 그래픽과 QR 코드를 분리하는 여백QR 코드 바깥 사방 최소 4모듈

c. 데이터 인코딩 모드

QR 코드는 담으려는 데이터의 종류에 따라 인코딩 모드를 자동 선택하여 효율을 최적화합니다.

인코딩 모드지원 문자문자당 비트최대 용량 (버전 40)
Numeric0-93.33 bits7,089자
Alphanumeric0-9, A-Z, 공백, $%*+-./:5.5 bits4,296자
ByteISO 8859-1 (UTF-8 포함)8 bits2,953바이트
KanjiShift JIS 한자13 bits1,817자

Note

한글은 Byte 모드에서 UTF-8로 인코딩됩니다. 한글 한 글자는 3바이트를 차지하므로, 같은 글자 수라도 영문보다 QR 코드 버전(크기)이 더 커질 수 있습니다.

d. 오류 정정 레벨

QR 코드의 가장 강력한 특징 중 하나는 리드-솔로몬(Reed-Solomon) 오류 정정 코드입니다. 코드 일부가 손상되거나 가려져도 데이터를 복원할 수 있습니다.

레벨복원 가능 비율용도
L (Low)~7%깨끗한 환경, 최소 크기가 필요할 때
M (Medium)~15%일반적인 용도에 권장
Q (Quartile)~25%로고 삽입 시 권장
H (High)~30%인쇄물, 야외 환경 등 손상 가능성이 높을 때

Important

로고를 삽입하면 데이터 영역 일부가 가려집니다. 로고 삽입 시에는 반드시 Q 레벨 이상의 오류 정정을 사용해야 안정적으로 스캔됩니다. 로고 크기는 전체 QR 코드 면적의 10~15% 이내로 제한하는 것이 안전합니다.

 


4. 실무에서 QR 코드가 쓰이는 곳

a. 마케팅 — 오프라인에서 온라인으로의 브릿지

포스터, 명함, 전단지에 QR 코드를 삽입하면 사용자가 URL을 직접 타이핑할 필요 없이 즉시 랜딩 페이지로 진입합니다. UTM 파라미터가 포함된 URL을 QR로 생성하면 오프라인 캠페인의 전환율까지 추적할 수 있습니다.

https://example.com/event?utm_source=poster&utm_medium=qr&utm_campaign=2025_summer

b. WiFi 접속 — 비밀번호를 말로 설명하지 않아도 되는 방법

카페나 회의실에서 "비밀번호가 뭐예요?"라는 질문을 줄일 수 있습니다. WiFi QR 코드를 스캔하면 자동으로 네트워크에 접속됩니다.

WIFI:T:WPA;S:MyNetwork;P:s3cur3P@ss!;H:false;;

c. vCard — 명함 교환의 디지털화

전화번호, 이메일, 회사 정보가 담긴 vCard 형식을 QR에 인코딩하면, 스캔 한 번으로 연락처가 휴대폰에 저장됩니다. 네트워킹 행사에서 종이 명함 대신 QR 코드 한 장이면 충분합니다.

d. 개발 워크플로 — CI/CD와 연동

빌드 결과물의 다운로드 링크나 스테이징 서버 URL을 QR로 생성하여 슬랙에 공유하면, QA 담당자가 모바일 기기에서 즉시 접속하여 테스트할 수 있습니다.

// Slack Webhook에 QR 코드 이미지를 첨부하는 예시
const QRCode = require('qrcode');

async function sendQRToSlack(url) {
  const qrDataUrl = await QRCode.toDataURL(url, {
    errorCorrectionLevel: 'M',
    width: 300,
  });
  // → data:image/png;base64,iVBORw0KGgo...
  await postToSlack({ text: `스테이징 배포 완료: ${url}`, image: qrDataUrl });
}

e. 인증 및 보안 — 2FA 설정

Google Authenticator나 Authy 같은 OTP 앱에 계정을 등록할 때, otpauth:// URI를 QR로 제공하는 것이 사실상 표준입니다.

otpauth://totp/MyService:user@example.com?secret=JBSWY3DPEHPK3PXP&issuer=MyService

f. 제조·물류 — 바코드의 한계를 넘어서

1차원 바코드로는 부품 번호 하나 정도만 담을 수 있었지만, QR 코드는 제조 일자, 로트 번호, 검수 결과까지 한 코드에 담을 수 있습니다. 생산 라인에서 카메라 하나로 모든 정보를 읽어내는 것이 QR의 원래 탄생 목적이었습니다.

 


5. QR 코드 디자인 시 반드시 지켜야 할 것들

QR 코드는 기계가 읽는 이미지입니다. 보기 좋은 디자인도 중요하지만, 인식률을 보장하는 규칙을 먼저 지켜야 합니다.

항목권장 기준주의사항
명암 대비전경과 배경의 명도 차 70% 이상연한 회색 패턴 + 흰 배경은 인식 실패율 높음
콰이어트 존QR 코드 바깥에 최소 4모듈 여백여백 없이 프레임에 붙이면 파인더 패턴 인식 불가
최소 출력 크기모듈 1개당 최소 0.33mm (인쇄 시)명함 크기에 버전 40 QR은 물리적으로 불가능
로고 크기전체 면적의 10~15% 이내오류 정정 Q 또는 H 레벨 필수
색상 규칙전경이 배경보다 항상 어두워야 함밝은 패턴 + 어두운 배경 (반전)은 일부 리더에서 실패

Important

디자인을 아무리 화려하게 꾸미더라도, 파인더 패턴 세 개는 절대 가려서는 안 됩니다. 파인더 패턴이 손상되면 스캐너가 QR 코드 자체를 인식하지 못합니다.

 


6. 자주 겪는 문제와 해결 방법

a. "분명히 URL을 넣었는데 스캔이 안 돼요"

원인: 대부분 콰이어트 존(여백) 부족이거나 배경색과 패턴 색의 대비가 너무 낮은 경우입니다. 포스터 디자인에 QR 코드를 꽉 채워 넣으면 파인더 패턴 주변 여백이 사라져 인식이 실패합니다.

// ❌ 잘못된 배치: 여백 없이 이미지 프레임에 꽉 채움
┌──────────┐
│██████████│  ← 콰이어트 존 없음
│██ QR  ██│
│██████████│
└──────────┘

// ✅ 올바른 배치: 4모듈 이상 여백 확보
┌──────────────┐
│              │
│   ████████   │  ← 사방에 충분한 여백
│   ██ QR ██   │
│   ████████   │
│              │
└──────────────┘

b. "한글이 들어간 텍스트가 깨져요"

원인: QR 코드 생성 라이브러리의 인코딩 설정이 Latin-1(ISO 8859-1)으로 되어 있는 경우 한글 바이트가 손실됩니다.

// ❌ 인코딩 미지정 시 일부 리더에서 한글 깨짐
QRCode.toDataURL('안녕하세요');

// ✅ UTF-8 Byte 모드를 명시적으로 지정
QRCode.toDataURL('안녕하세요', {
  mode: 'byte',       // Byte 모드 강제
  version: undefined,  // 자동 버전 선택
});

Note

본 도구는 내부적으로 UTF-8 Byte 모드를 기본 적용하므로, 한글을 포함한 모든 유니코드 문자를 정상적으로 처리합니다.

c. "로고를 넣었더니 인식률이 크게 떨어졌어요"

원인: 로고가 데이터 영역을 과도하게 가리면서, 오류 정정 레벨이 낮아 복원 한계를 초과한 것입니다.

// ❌ 오류 정정 L + 로고 20% 크기
→ 복원 가능: 7% / 손상: 20% → 인식 실패

// ✅ 오류 정정 H + 로고 12% 크기
→ 복원 가능: 30% / 손상: 12% → 안정적 인식

d. "같은 URL인데 생성할 때마다 QR 코드 모양이 달라요"

원인: QR 코드 생성 시 적용되는 마스크 패턴(총 8가지)이 매번 최적으로 선택되며, 오류 정정 코드도 달라질 수 있습니다. 내용은 동일하지만 시각적 배치가 달라지는 것은 정상 동작입니다. 어떤 모양이든 스캔 결과는 동일합니다.

e. 공통 해결 패턴

위 문제들의 해결 방법을 관통하는 공통 원칙이 있습니다.

  1. QR 코드는 기계가 읽는 이미지라는 점을 항상 기억하기 — 디자인 요소보다 인식 규칙이 우선입니다.
  2. 오류 정정 레벨을 상황에 맞게 높이기 — 로고 삽입, 인쇄, 야외 사용 시에는 Q 또는 H 레벨을 선택합니다.
  3. 생성 후 반드시 실제 기기에서 테스트하기 — 모니터에서는 잘 보이지만 인쇄물에서 실패하는 경우가 많습니다. iOS와 Android 기기 모두에서 확인하는 것을 권장합니다.

 


7. 생각해볼 거리

QR 코드의 오류 정정은 왜 리드-솔로몬 알고리즘을 사용할까요?

리드-솔로몬 코드는 연속적인 오류(burst error)에 강하다는 특성이 있습니다. QR 코드가 물리적으로 손상될 때는 한두 비트가 아니라 특정 영역 전체가 통째로 훼손되는 경우가 대부분인데, 리드-솔로몬은 이런 집중 손상을 효과적으로 복원합니다. CD, DVD, 우주 통신 등 물리적 매체에서 오랫동안 검증된 알고리즘이기 때문에, 1994년 QR 코드 설계 당시에도 가장 합리적인 선택이었습니다.

QR 코드에 악성 URL이 담겨 있다면, 사용자는 어떻게 알 수 있을까요?

QR 코드는 사람이 육안으로 내용을 확인할 수 없다는 점에서 피싱(QRishing) 공격에 취약합니다. 공공장소에 붙어 있는 QR 코드 위에 악성 URL이 담긴 스티커를 덧붙이는 사례도 보고되어 있습니다. 대부분의 최신 모바일 OS는 QR 스캔 시 URL 미리보기를 보여주므로, 반드시 도메인을 확인한 뒤 접속하는 습관이 필요합니다. 생성자 입장에서는 커스텀 도메인이나 브랜드가 드러나는 단축 URL을 사용하여 신뢰를 확보하는 것이 중요합니다.

1차원 바코드는 QR 코드에 완전히 대체될까요?

반드시 그렇지는 않습니다. 1차원 바코드(EAN-13, UPC 등)는 레이저 스캐너로 빠르게 읽을 수 있고, 좁은 면적에서 숫자 데이터만 전달하면 되는 소매 유통 환경에서는 여전히 효율적입니다. QR 코드는 카메라 기반 스캐닝이 필요하고 상대적으로 더 넓은 인쇄 면적을 요구합니다. 결국 담아야 할 데이터의 양과 스캔 환경에 따라 두 기술이 공존하는 것이 현실적인 흐름입니다.

 

브라우저 탭 하나로 URL, WiFi, 연락처 등 어떤 데이터든 즉시 QR 코드로 변환하고 — 터미널을 열거나 라이브러리를 설치하는 과정 없이 디자인까지 마무리할 수 있습니다. 그것만으로도 이 도구의 역할은 충분하다고 생각합니다.

자주 묻는 질문

아이폰과 갤럭시 스마트폰 모두 스캔이 가능한가요?

네, 완벽하게 호환됩니다. 별도의 QR코드 리더기 앱을 다운로드할 필요 없이, 아이폰과 갤럭시 모두 기본 '카메라' 앱을 켜서 화면에 비추기만 하면 자동으로 인식됩니다.

만들어진 QR코드는 유효기간이 있나요?

아니요, 유효기간은 평생 무제한입니다. utilzip에서 만든 코드는 일회성이 아니며, 입력하신 정보를 직접 변경하지 않는 이상 영구적으로 사용할 수 있습니다.

입력한 정보가 서버에 저장되거나 유출될 위험은 없나요?

안심하셔도 됩니다. 입력하신 모든 정보는 오직 사용자님의 브라우저(로컬 환경) 안에서만 코드를 생성하는 데 사용되며, 저희 서버로 전송되거나 절대 저장되지 않습니다.

출력물에 사용하고 싶은데 화질이 깨지지 않을까요?

고화질 인쇄를 위해 SVG 다운로드 형식을 지원합니다. SVG는 벡터 파일로 아무리 크게 확대해도 화질 저하가 없어 명함부터 대형 현수막까지 모든 인쇄물에 적합합니다.