Ctrlk
YouTube ChannelBook A DemoContact SupportSubscribe for Updates
For the complete documentation index, see llms.txt. This page is also available as Markdown.

QR Code

The Avonni QR Code displays scannable QR codes within flows, enabling easy access and information sharing.

Overview

The QR Code component generates a scannable QR code from any text value — a URL, a record ID, a product code, or any string from your flow. Users can scan it with a mobile device to open a link or retrieve information instantly.

Tutorials

Name
Description
Illustration

Generate a QR Code from a record field

Explore how to convert any Salesforce record field into a scannable QR Code.

Configuration

To configure it, click the component on the Flow screen. The Edit QR Code Component panel opens on the right with two tabs: Properties and Style. The sections below mirror the Properties tab.

Properties

Setting
What It Does

Value

The text encoded into the QR code. Enter a URL, record field value, or any text directly, or map it to a flow variable or resource.

Width

Maximum width of the QR code image in pixels.

Advanced Options

Setting
What It Does

Encoding

The character encoding mode: ISO 8859-1 (default, supports Latin characters) or UTF-8 (supports all Unicode characters, including accented and non-Latin text).

Error Correction

How much of the code can be damaged and still scan correctly: L (default, ~7%), M (~15%), Q (~25%), or H (~30%). Higher levels produce a denser code.

Styling

The Style tab gives you fine-grained control over the QR Code's appearance. Configure it from the Style tab of the Edit QR Code panel.

Controls the outer spacing around the QR code, creating space between it and other elements on the screen.

  • Top / Right / Bottom / Left: Adjust the space on each side.

Controls the inner spacing between the QR code and its edges.

  • Top / Right / Bottom / Left: Adjust the inner spacing on each side.

Customizes the border surrounding the QR code.

  • Color: Set the border color.

  • Size: Adjust the border thickness.

  • Style: Choose a border style (e.g. solid, dashed, dotted).

  • Radius: Control the roundness of the corners.

Sets the QR code colors.

  • Color: Set the foreground (module) color of the QR code.

  • Background Color: Set the background color behind the QR code modules.

Last updated

Was this helpful?