QR-код у вектор: зберігайте чіткість коду навіть на розмірі плаката

Ваш QR-код добре виглядає на екрані, але друкується розмито на банері, або принтер вимагає векторний файл. Трасуйте точний шаблон у чіткий SVG або PDF, а потім протестуйте його перед друком.

Помістіть сюди ваш QR-код

Перетягніть зображення або клацніть, щоб вибрати файл.

Вибрати зображення

PNG, JPG, WEBP, BMP, GIF

Конвертер відкривається з рекомендованими нижче налаштуваннями. Відкрити конвертер без файлу

Вихідна растрова сітка

Стилізований QR-код з круглими точками, квадратами зі заокругленими кутами та логотипом у центрі, збережений як зображення розміром 400 пікселів

вектор SVG

Той самий QR-код, перетворений на SVG, з збереженням точок, кутових квадратів та логотипу
Неотредагований вивід SVGR із налаштуваннями нижче (Дизайн, якість 2) з зображенням розміром 800 пікселів. Перед публікацією ми декодували відтворений SVG за допомогою зчитувача штрих-кодів на п’яти розмірах: кожен відкривав той самий посилання, що й оригінал.

Як перетворити QR-код на вектор

  1. Scan it first. Скануйте код за допомогою телефону та перегляньте посилання, яке він відкриває. Якщо це коротке посилання генератора QR-кодів, прочитайте розділ про динамічні коди, перш ніж продовжувати.
  2. Crop with the margin. Обріжте зображення до коду, але збережіть повний білий край навколо нього. Знімок екрана або оригінальний експорт кращі, ніж фото або JPEG.
  3. Check the square size. Спробуйте отримати код шириною щонайменше 800 пікселів перед конвертуванням — за такого розміру квадрати достатньо великі, щоб витримати фільтр, який видаляє згладжування. Якщо у вас є лише менша копія, повторіть експорт з більшим розміром із генератора, якщо це можливо; якщо ні, збільште масштаб у 4 рази перед завантаженням, що дозволить зберегти зчитуваність, хоча краї залишаться м’якими, як у оригіналі.
  4. Drop it in. Завантажте зображення вище. Рекомендовані налаштування застосовуються автоматично, а конвертування та перегляд є безкоштовними.
  5. Scan the preview. Скануйте попередній перегляд на екрані своїм телефоном. Якщо відкривається правильна сторінка, завантажте SVG або PDF-файл QR-коду за один кредит.
  6. Print a proof. Друкуйте тест у реальному розмірі та скануйте його з реальної відстані за допомогою як iPhone, так і Android-телефона.

Рекомендовані налаштування

Тип зображенняДизайнНе існує спеціального типу QR-коду. Дизайн розроблено для плоского мистецтва з чіткими кутами: він зберігає квадратні кути та залишає кожен модуль єдиною формою, не заокруглюючи його.
Якість2/10Низька, а не висока. Відсканований або експортований QR-код має м'яку антиаліасовану облямівку навколо кожного квадрата, а налаштування високої якості відтворює цю облямівку як додаткові бліді фігури — код виглядає пухнастим, якщо роздивитися його зблизька. Якість 2 фільтрує її: на нашому зразку це скоротило розмір файлу з 131 КБ до 55 КБ і кількість кольорів з 642 до 94, і код все одно сканувався. Підступ полягає в тому, що той самий фільтр видаляє квадрати, які занадто малі, тому перед конвертацією код повинен мати розмір приблизно 800 пікселів.
Розпізнати текстВимкненоВимкнено: QR-код не містить тексту для розпізнавання, а будь-який підпис навколо нього безпечніше зберегти як відтворені фігури.
Прозорий фонВимкненоВимкнено: білий поля — це тиха зона, необхідна сканерам, і її видалення завадило 93 з 162 тестових кодів декодуватися на темному фоні.
Об'єднати контуриВимкненоНе має ефекту для типу логотипу (стосується лише типів фотографій), тому залиште його вимкненим.

Чому QR-код у форматі PNG розмивається на плакаті

QR-код у форматі PNG або JPG — це сітка пікселів. Якщо розтягнути зображення розміром 300 пікселів на банер шириною 60 см, кожен піксель перетвориться на видимий блок з м'якими краями, а JPEG додасть сірі плями навколо кожного модуля.

Перетворення QR-коду на вектор замінює пікселі на фігури. Кожен темний модуль отримує чіткий край, який чітко друкується в будь-якому розмірі, і ви отримуєте файл, який вимагає ваш принтер: SVG або векторний PDF, який принтер може масштабувати.

Сам шаблон не змінюється. Відстежений код містить ті самі дані, що й оригінал, за умови, що кожен модуль успішно пройшов відстеження. Решта цієї сторінки присвячена тому, як забезпечити це.

Надайте йому достатньо великий код, а потім дозвольте фільтру очистити краї

На те, чи є відтворений QR-код чітким і зчитуваним, впливають дві речі, які суперечать одна одній. Повзунок якості визначає, наскільки дрібну точку залишає трасувач. Низькі налаштування відкидають м'кі пікселі антиаліасингу навколо кожного квадрата, що робить вектор чітким, — але той самий фільтр може відкинути цілі квадрати, якщо вони занадто малі.

Отже, виправлення полягає у розмірі, а не якості. Приблизно 800 пікселів у ширину, квадрати значно більші за фільтр, а рекомендована якість 2 видаляє лише облямівку: наша вибірка зменшилася з 642 кольорів до 94 і з 131 КБ до 55 КБ, і сканувалася при кожному розмірі, який ми тестували. Підвищення якості натомість зберігає облямівку і відтворює її як сотні блідих примарних форм навколо візерунка.

Якщо у вас є лише невелика копія, повторно експортуйте її з генератора у більшому розмірі, наскільки це можливо. Збільшення маленького зображення в 4 рази зберігає його зчитуваність — це допомогло виправити всі неуспішні коди в наших тестах, навіть квадрати шириною 2,5 пікселя, — але збільшення також розмиває м'які краї, тому результат буде більшим і менш чітким, ніж справжнє велике оригінальне зображення.

Потрібен код на темному або кольоровому фоні? Залиште білий поля у векторному файлі та розмістіть код на білій панелі у вашому макеті, замість того, щоб видаляти фон.

Якого розміру друкувати QR-код і який відступ йому потрібен?

Кожен QR-код потребує зони спокою: чіткого поля шириною 4 модулі з кожного боку, або 2 модулі для меншого формату Micro QR. Сканери використовують її для пошуку коду, тому обрізайте вихідне зображення, залишаючи весь білий край, і не розміщуйте текст чи графіку в цій зоні.

Щодо розміру, галузевим правилом є 10:1: код має бути приблизно в десять разів вужчим за відстань, з якої його сканують. Це рекомендація від виробників QR-генераторів, а не частина стандарту ISO, і коди, що містять довгі URL-адреси, є більш щільними і потребують більше місця.

Додайте 20–30% для тьмяного освітлення або крутих кутів огляду. Наведені нижче ширини стосуються самого коду; зберігайте тиху зону навколо нього.

Приблизні розміри друку QR-кодів (емпіричне правило 10:1)
Where it's scannedScan distanceCode width
Літівка, меню, картка або упаковкаArm's lengthПринаймні 2 см (приблизно 0,8 дюйма)
Poster1–2.5 m (about 3–8 ft)10–25 cm (about 4–10 in)
Billboard7.5–15 m (about 25–50 ft)75–150 см (близько 30–60 дюймів)

Виправлення помилок, логотипи та кольори

QR-коди містять резервні дані, тому вони можуть витримати пошкодження. Існує чотири рівні корекції помилок: L може відновити близько 7% кодових слів, M — 15%, Q — 25% та H — 30%.

Логотип у центрі працює за рахунок покриття модулів, а система виправлення помилок заповнює їх знову. Це означає рівень H, центральний логотип шириною не більше приблизно 20–25% від коду, і нічого, що перекриває три великі пошукові квадрати у кутах.

Цей бюджет відновлення є спільним. Тривожне коливання, пляма на відбитку та подряпина використовують одну й ту саму резервну місткість, тому код, який уже має логотип, має менше місця для чогось іншого. Тестуйте стилізовані коди ретельніше, а не менше.

Тримайте темні модулі на світлому фоні. Стандарт дозволяє інвертовані коди (світлий на темному), але деякі додатки для сканування на Android та старіші програми не можуть їх зчитати. Якщо ваш дизайн передбачає такий варіант, протестуйте його на кількох телефонах перед тим, як друкувати тираж.

Статичний або динамічний: векторизація копіює посилання, а не призначення.

Статичний код зберігає ваш URL напряму. Динамічний код зберігає посилання на перенаправлення генератора, яке пересилає на вашу сторінку. Якщо підписка або безкоштовна пробна версія закінчиться, сканування призведе до неактивної сторінки.

Векторизація копіює шаблон, тому копіюється й перенаправлення. Вона не може врятувати терміновий динамічний код. Спочатку відскануйте код і подивіться на URL; якщо він вказує на генератор, а не на вас, виправте посилання або створіть новий статичний код перед друком.

Деякі коди мають власний графік дії. QR-коди груп у WeChat перестають працювати через 7 днів, а код запрошення до групи у WhatsApp стає недійсним одразу після того, як адміністратор скине посилання для запрошення. Більш чіткий текст не поверне їх до життя.

Чи слід вам перегенерувати код, або відстежити його?

Якщо це звичайний чорно-білий код і ви контролюєте URL, не скануйте його. Вставте посилання в будь-який генератор, який може експортувати QR-код у SVG, і ви отримаєте векторний QR-код з точними модулями.

Відстеження використовується для кодів, які при регенерації змінюються або не можуть бути відтворені:

  • Стилізовані або брендовані коди: індивідуальні кольори, заокруглені точки, індивідуальні кутові вічка, градієнтне заповнення або центральний логотип
  • Код, який є частиною більшого дизайну, наприклад, оформленої наклейки або таблички, який ви хочете залишити без змін
  • Код від облікового запису генератора, до якого ви більше не маєте доступу
  • Код, створений кимось іншим, наприклад, закладом або партнером, коли у вас є лише зображення
  • Коди міні-програм WeChat, круглі коди, які звичайні генератори QR-кодів не можуть створити
  • Ваш власний платіжний код у брендованій рамці. Спочатку перевірте, чи пропонує ваш платіжний провайдер офіційні друковані знаки, а потім протестуйте друк у додатку для платежів, щоб переконатися, що гроші надходять вам.

Що трасування не може виправити

  • Інструменти генеративного ШІ, які перемальовують зображення як новий вектор, є неправильним інструментом для QR-кодів. Один неправильний модуль руйнує код; трасування зберігає початкову геометрію.
  • Розмита або знята під кутом фотографія надрукованого коду може втратити деякі модулі ще до початку зчитування. Знімайте прямо, виправте перспективу або, краще за все, знайдіть вихідний файл.
  • Малі JPEG-зображення можуть втрачати модулі за будь-яких налаштувань, якщо ви спочатку не збільшите їх розмір. У наших тестах JPEG із модулями 6,5 пікселів не пройшов навіть за якості 10.
  • Наші вимірювання використовували синтетичні коди та програмний декодер, а не камери телефонів. Вони показують, які налаштування зберігають модулі цілими; вони не замінюють сканування друкованої проби.
  • Ви отримуєте SVG або векторний PDF у кольоровому просторі RGB, без виїмки за межі аркуша та без CMYK. Більшість друкарень приймають PDF; якщо ваша вимагає EPS або AI, відкрийте файл у Illustrator або Inkscape та збережіть його у відповідному форматі.
  • Круглі точки, відтворені з маленького зображення, виходять трохи кутовими, як у прикладі вище. Це не завадило коду проходити перевірки під час сканування, але більше джерело дає більш округлі точки.

Часто задавані запитання

Чи змінює перетворення QR-коду на вектор посилання?

Ні. Відтворення копіює шаблон модулів, і цей шаблон є даними. Якщо оригінал відкрив вашу сторінку, чистий відтворений варіант відкриє ту саму сторінку; якщо він відкрив перенаправлення генератора, так само зробить і вектор.

Якого розміру має бути мій QR-код?

Приблизно одна десята відстані сканування та щонайменше 2 см завширшки для будь-якого тексту, що читається на відстані витягнутої руки. Додайте 20–30% погіршення якості при слабкому освітленні та зберігайте 4-модульну зону спокою навколо неї.

Я створив код за безкоштовною пробною версією. Чи продовжуватиме працювати вектор?

Тільки якщо це статичний код. Динамічний код вказує на перенаправлення генератора, яке перестає працювати після закінчення пробного періоду, незалежно від того, наскільки гострим є вектор. Скануйте його та спочатку перевірте URL.

Чи можу я розмістити логотип у центрі?

Так, з обережністю: використовуйте рівень корекції помилок H, розміщуйте логотип по центру і не ширше приблизно 20–25% коду, а також уникайте накладання на квадрати пошуку. Якщо у вас уже є код із логотипом, SVGR обробляє код і логотип разом.

Чи можу я використовувати білий QR-код на темному фоні?

Стандарт це дозволяє, але деякі додатки для сканування на Android та старіші версії не можуть зчитувати інвертовані коди. Темний на світлому фоні є безпечнішим; якщо ви використовуєте інвертовані коди, спочатку протестуйте їх на iPhone та кількох пристроях Android.

Чому мій відтворений QR-код не сканується?

Зазвичай тиху зону обрізали, код був занадто малим для налаштування якості або фон робили прозорим, і код розміщувався на темному кольорі. Почніть з копії шириною щонайменше 800 пікселів, збережіть біле поле та конвертуйте знову.

Чи можу я векторизувати штрих-код (UPC або EAN) таким же чином?

Не скануйте штрихкоди. Ширина смуг і проміжів має бути точним кратним базової ширини, номінально 0,330 мм для EAN-13, а сканер може мати похишку в частку. Цифри, надруковані під штрихкодом, є даними, тому перегенеруйте їх у програмі для роботи з штрихкодами.

Чи можу я отримати векторний QR-код з Canva?

Якщо код згенерувала Canva, то так: за нашими перевірками, QR-коди Canva, експортовані у PDF, перетворюються на векторні фігури, а завантаження SVG вимагає платного плану Canva. QR-код, який ви завантажили до Canva як PNG, залишається растровим зображенням, тому його потрібно обвести тут.

Пов'язані сценарії використання

Надаєте перевагу короткому огляду? Прочитайте посібник: Перетворити QR-код на SVG

Готові конвертувати?

Конвертування та перегляд безкоштовні, без необхідності облікового запису. Завантаження SVG або PDF використовує один кредит.