Design branded QR codes with custom eyes, body shapes, colors, and embedded center logos.
Turn a URL or short text into a QR code that looks like part of your brand: rounded or dotted modules instead of hard squares, a custom eye style, your palette, and a logo embedded in the center. The styling is cosmetic. The code still encodes exactly the characters you typed, and every decorative choice is a bet against your scanner's ability to read it. Low-contrast colors and logos that cover too many modules cause most failures, not bad data. The preview flatters: test a real print at the size and distance the code will actually be scanned before you rely on it.
A concrete input and expected output from the current implementation.
Input
https://example.com · Error correction: H · Rounded dot modules · Teal (#1F8A70) on white · Center logo: on
Expected output
A downloadable 29x29-module QR code (version 3): teal rounded-dot modules on white, standard three-corner eyes, logo centered. Scanners open https://example.com. The URL is 19 characters; at level H a version 2 code (25x25) holds at most 14 bytes, so the smallest fitting grid is version 3, whose H capacity is 24 bytes.
Error correction H tolerates damage to roughly 30 percent of the code, which is what makes a center logo viable. Version 2 at H caps at 14 bytes, below the 19-byte URL, so the encoder steps up to version 3 (29x29 modules). Every version adds 4 modules per side, hence 21, 25, 29.
The payload is packed into the QR grid at the smallest version that fits the chosen error correction level. Version 1 is 21x21 modules; each higher version adds 4 modules per side and more capacity. Levels L, M, Q, and H restore roughly 7, 15, 25, and 30 percent of a damaged code respectively, so H gives the most slack for a center logo, at the cost of capacity.
The three corner eyes are the finder patterns scanners use to locate and orient the code. Most readers expect their concentric square structure, so heavy eye restyling is the riskiest change. Module shapes and colors are more forgiving, but dark modules must stay markedly darker than light ones, and the quiet zone - at least 4 modules of plain background around the code - must survive your design.
Almost always contrast or geometry: module and background tones too close together, eyes restyled beyond what the scanner's finder detection tolerates, a quiet zone smaller than 4 modules, or a logo covering too much of the grid. Keep modules dark on a light background, keep the three eyes recognizable, and test a real print at its intended size and distance.
Less than a plain one, and usually you want it that way. Even the largest QR version tops out at a few thousand characters, and a stylized code with a center logo is only dependable with short payloads: a URL, a phone number, a sentence. High error correction eats capacity - at level H a version 2 code holds just 14 bytes - so long payloads force denser versions that scan less reliably.
The example and behavioral notes were checked against the browser implementation. Standards and primary references below define the relevant format, formula, or platform behavior.
Shorten URLs with local redirect tracking via localStorage. See click counts and generate a QR code for each link.
Build UTM-tagged URLs for campaign tracking with source, medium, campaign, term, and content parameters.
Enter 2+ headlines and see simulated previews in Google results, email subject lines, and social posts side-by-side.
Count characters for Twitter/X, LinkedIn, Facebook, and Instagram with platform-specific limits and warnings.
Calculate click-through rates from impressions and clicks with industry benchmarks and trend analysis.
Check email subject line length against best practices for desktop and mobile with preview text optimization.