Project #001

QR Code Generator

Công cụ tạo mã QR đa năng — URL, văn bản, Wi-Fi, email, vCard và hơn thế nữa. Tùy chỉnh màu sắc, thêm logo, xuất file PNG/SVG. Chạy hoàn toàn trên trình duyệt, không cần server.

DemoOpen SourceClient-side
QR Code Generator cover
Live Demo

Dùng thử ngay

Tất cả xử lý diễn ra ngay trên trình duyệt của bạn — không gửi dữ liệu đi đâu cả.

Xem trước

100% client-side · Không upload dữ liệu · Không cần đăng nhập

Tính năng

URL

Liên kết web

Text

Văn bản tự do

Wi-Fi

Chia sẻ mật khẩu

Email

Soạn email sẵn

Phone

Quét để gọi

SMS

Tin nhắn nhanh

Vị trí

Tọa độ địa lý

vCard

Danh bạ liên hệ

Đổi màu

Nền & mã tùy ý

Logo

Chèn ảnh giữa QR

PNG / SVG

Xuất file HD

Về dự án này

JavaScriptCanvas APIqrcode-generatorHTML5 File API

Giới thiệu

QR Code Generator là công cụ mã nguồn mở giúp bạn tạo mã QR nhanh chóng ngay trên trình duyệt — không upload dữ liệu lên server, không cần đăng nhập, không cần cài đặt gì cả.

Tính năng

  • 🔗 URL — Tạo QR dẫn đến một liên kết web
  • 📝 Văn bản — Mã hóa bất kỳ đoạn text nào
  • 📶 Wi-Fi — Chia sẻ mật khẩu Wi-Fi chỉ bằng một lần quét
  • 📧 Email — Mở sẵn email với người nhận, chủ đề, nội dung
  • 📞 Số điện thoại — Quét là gọi luôn
  • 💬 SMS — Gửi tin nhắn nhanh với nội dung có sẵn
  • 📍 Vị trí — Chia sẻ tọa độ địa lý
  • 👤 vCard — Lưu thông tin liên hệ trực tiếp vào điện thoại
  • 🎨 Tùy chỉnh màu QR — Đổi màu nền và màu mã theo ý thích
  • 🖼️ Thêm logo — Chèn logo/ảnh vào giữa mã QR
  • 📥 Xuất file — Tải về dạng PNG hoặc SVG chất lượng cao

Công nghệ

100% chạy phía client (client-side rendering). Không gửi dữ liệu đi đâu cả — mọi thứ bạn nhập chỉ tồn tại trên máy bạn.

Thư viện sử dụng:

  • qrcode-generator — Tạo ma trận QR code chuẩn ISO 18004
  • Canvas API — Render QR lên canvas, xử lý logo overlay
  • HTML5 File API — Đọc file logo drag-and-drop từ máy người dùng

Định dạng dữ liệu

| Loại | Định dạng | |------|-----------| | Wi-Fi | WIFI:T:WPA;S:{ssid};P:{password};; | | Email | MAILTO:{email}?subject={subject}&body={body} | | SMS | SMSTO:{number}:{message} | | Geo | geo:{lat},{long} | | vCard | Chuẩn vCard 3.0 |

Dùng thử

👉 Dùng ngay bản demo bên dưới, không cần tải gì.

Thích dự án này? Bấm "Xem mã nguồn trên GitHub" để xem cách mình code, fork về dùng riêng, hoặc đóng góp thêm tính năng.

Open Source

Thích dự án này?

Toàn bộ mã nguồn mở trên GitHub — fork về dùng riêng, đóng góp tính năng, hoặc chỉ đơn giản là xem cách mình code.

Xem mã nguồn / Fork trên GitHub