QR Code - multi-style , fully integrated in Elements

Hi guys, here is a new component called QR CODE for Elements

A useful component to add to your site effective tools for communicating information of any kind on Desktop

qr-code_multithemes_001

A QR code that actually looks like part of your site. QR Code for Elements generates fully styled, scannable codes directly on your page: colors from your theme palette, gradients, custom corner styles, rounded or dot-shaped modules. The same code can feel minimal and technical or bold and graphic, depending on how you style it.

10 Options (+ Obscured Email)

qr-code_multithemes_003

qr-panel-type

A built-in :gear::hammer_and_wrench: JavaScript library handles all the generation, with no external dependencies. Everything is controlled from the inspector.

Features

qr-code_multithemes_004

The demo pages show what’s possible: individual codes styled from scratch, real-world banner layouts where the code is integrated into the design, and a few examples using CSS blend modes to make the colors interact with the background. qr-code_multithemes_006

Key features:

Ten content types: URL, phone, WhatsApp, email, V-Card, text, WiFi, SMS, calendar event, GPS coordinates.

Email bot protection: address split into two parts, never visible in full in the page source. Email encoding includes a built-in bot protection option that splits the address into two parts, invisible to scrapers, fully functional when scanned. Same protection as Obscure Contact, a great complement to this component!

Full color control: main color, dots gradient with configurable direction, independent corner colors and opacity, background.

Module styles: sharp, soft, rounded, or dots for modules, corners, and corner dots.

Optional download button with full styling control: label, color, background, border, margin, padding.

Responsive visibility by Elements Theme Studio

Demo project with ready-to-use designs included.

QR code in available in the Marketplace

Now in promo

Thanks!

Upgrade: B3 - Internal Librasty to latest 1.8.3

Just to let those who purchased QR-Code know that I’ve updated the internal library, which improves performance and also fixes some issues when using multiple instances.

Upgrade it and enjoy the component! :smiling_face_with_sunglasses:

Now in Promo :grinning_face:

Upgrade: B5 QR Code is AI-ready :light_bulb:

This update makes QR Code fully compatible with the Elements AI Assistant. Every option now carries a clear, plain-language description.

Example: “Add a QR code with my contact card: Anna Rossi, mobile +39 333 1234567, Via Roma 10, 20121 Milan. Dark blue dots fading to purple, rounded corners in orange, and a download button.”

The AI builds a V-Card with name, phone and address, then applies the gradient, the corner color and the button in one step.

So, If you haven’t purchased QR Code yet, now is the time to take a look at the demos, if you already have, make sure to update it.

thanks!