# QR Code

QR code component allows you to dynamically display any value as a QR code.

## How to add a static QR Code

Drag and drop QR Code component onto page and fill it with any value, such as URL.

{% @arcade/embed flowId="qHf6RxaHTCjtsHpkwGwg" url="<https://app.arcade.software/share/qHf6RxaHTCjtsHpkwGwg>" %}

## How to pass values to QR Code component

You can [pass any value](/user-guide/design-and-structure/components/layouts/overlays/overlay-parameters.md) to the component and it will output it as QR Code.

Let's make an example of QR codes for sending emails with subject and body, referencing the email from selected row on a table, and getting subject and body from text inputs.

You will need:

1. [A table with emails](#a-table-with-emails)
2. [Two text inputs for subject and body of an email](#text-inputs)
3. [QR code component with formula as a value](#qr-code-and-value-formula)

### A table with emails

Any [table](/user-guide/design-and-structure/components/lists/table.md) that has emails as one of the columns will do.

<figure><img src="/files/IkYcpINfMv11qVJrdzSC" alt=""><figcaption><p>Table with customers as an example</p></figcaption></figure>

### Text inputs

Drag and drop two text inputs. You can optionally rename them to "Subject" and "Body" and make the second one to have multiple lines.

<figure><img src="/files/LBzdqDnXLIvf8VgTXefH" alt=""><figcaption><p>Two text inputs</p></figcaption></figure>

### QR Code and value formula

Add the QR Component anywhere on the page and click on *"Fx"* button to start typing in your formula. It should have this syntax:

<pre><code><strong>FORMAT(
</strong>"mailto: {0} ?subject= {1} &#x26;body= {2}",
%email_value_here%,
%subject_value_here%,
%body_value_here% 
)
</code></pre>

{% hint style="info" %}
Make sure to change the placeholders to values that reference your page
{% endhint %}

### Interactive guide with example

{% @arcade/embed flowId="UBzkyLluSqFqvOFHccxz" url="<https://app.arcade.software/share/UBzkyLluSqFqvOFHccxz>" %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.jetadmin.io/user-guide/design-and-structure/components/qr-code.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
