# QR code card
> Canonical HTML: https://screenrig.ai/docs/cards/qr-code/
Any QR action, from a link with campaign tracking to Wi-Fi, contacts, events and app stores, as a crisp styled code with an optional logo, frame and call to action.
Category: Messages. Tags: QR codes, Stores, Restaurants and cafes, Lobbies and reception.
## Previews
Canvas
Corner
Chip
## Views and forms
Views: canvas, corner, chip. Canvas forms: landscape, portrait.
[Card views, themes and publishing](/docs/cards/). [Browse the gallery](/apps/#cards).
## Data and privacy
This card uses its configured properties and live card data.
## Properties
For theme, background, accent and position, see [Common properties](/docs/cards/#common-properties).
Set static properties in `params`. Bind `data` to a project card data key for live values; that document holds only dynamic properties. Without a data key, put the complete configuration in `params`. Nested rows describe the contents of their parent property.
### Static properties
| Name | Type | Default | Values and limits | Description |
| --- | --- | --- | --- | --- |
| `ecc` | string | `"M"` | `"L"`, `"M"`, `"Q"`, `"H"` | |
| `ink` | string | `"#111111"` | pattern: `"^#[0-9A-Fa-f]{6}$"` | Module colour. Keep it dark on a light paper. |
| `paper` | string | `"#FFFFFF"` | pattern: `"^#[0-9A-Fa-f]{6}$"` | Card colour behind the code. |
| `style` | object | | additionalProperties: `false` | Module and finder-eye shapes; each defaults to the theme's. |
| `style.modules` | string | | `"square"`, `"rounded"`, `"dots"`, `"connected"` | |
| `style.eyes` | string | | `"square"`, `"rounded"`, `"circle"`, `"leaf"` | |
| `logo` | null, string | `null` | `null`, `"activity-01"`, `"air-vent"`, `"airplane-01"`, `"alert-01"`, `"alert-02"`, `"american-football"`, `"analytics-up"`, `"apple"`, `"arrow-down-01"`, `"arrow-down-right-01"`, `"arrow-up-01"`, `"arrow-up-right-01"`, `"award-01"`, `"baseball"`, `"basketball-01"`, `"battery-full"`, `"bell-ring"`, `"bicycle"`, `"birthday-cake"`, `"bitcoin"`, `"bus-01"`, `"calendar-03"`, `"calendar-04"`, `"calendar-add-01"`, `"calendar-check"`, `"call-02"`, `"camera-01"`, `"cancel-circle"`, `"car-01"`, `"champion"`, `"chart-decrease"`, `"chart-increase"`, `"checkmark-circle-02"`, `"clock-01"`, `"clock-02"`, `"cloud"`, `"cloud-angled-rain"`, `"cloud-angled-zap"`, `"cloud-big-rain"`, `"cloud-drizzle"`, `"cloud-fog"`, `"cloud-hailstone"`, `"cloud-snow"`, `"coffee-01"`, `"coffee-02"`, `"contact-01"`, `"container-truck-01"`, `"cricket-bat"`, `"crown"`, `"delivery-truck-01"`, `"dices"`, `"discord"`, `"discount-tag-01"`, `"dollar-02"`, `"door-closed-locked"`, `"door-open"`, `"drink"`, `"droplet"`, `"ethereum"`, `"euro"`, `"exchange-01"`, `"facebook-01"`, `"factory"`, `"fast-wind"`, `"favourite"`, `"ferry-boat"`, `"fire"`, `"fire-02"`, `"first-aid-kit"`, `"flag-01"`, `"flag-02"`, `"flash"`, `"flower-01"`, `"football"`, `"gauge"`, `"gift"`, `"git-branch"`, `"globe-02"`, `"google"`, `"hand-prayer"`, `"heart"`, `"help-circle"`, `"home-01"`, `"hourglass"`, `"humidity"`, `"ice-hockey"`, `"information-circle"`, `"instagram"`, `"lamp-01"`, `"lantern"`, `"leaf-01"`, `"leaf-02"`, `"lightbulb"`, `"link-01"`, `"linkedin-01"`, `"litecoin"`, `"location-01"`, `"location-04"`, `"mail-01"`, `"medal-first-place"`, `"medical-mask"`, `"meeting-room"`, `"megaphone-01"`, `"message-01"`, `"money-exchange-02"`, `"moon-02"`, `"moon-cloud"`, `"moon-star"`, `"music-note-01"`, `"navigation-03"`, `"new-releases"`, `"new-twitter"`, `"news"`, `"news-01"`, `"noodles"`, `"package-delivered"`, `"parking-area-square"`, `"party"`, `"party-popper"`, `"pause-circle"`, `"percent-circle"`, `"pinterest"`, `"pizza-01"`, `"play-circle"`, `"play-store"`, `"podium"`, `"pound"`, `"pumpkin"`, `"qr-code"`, `"qr-code-01"`, `"queue-01"`, `"quote-down"`, `"quote-up"`, `"ranking"`, `"restaurant-01"`, `"rocket-01"`, `"rss"`, `"running-shoes"`, `"sale-tag-01"`, `"security-check"`, `"shop-sign"`, `"shopping-bag-01"`, `"siren"`, `"smart-phone-01"`, `"snapchat"`, `"snowflake"`, `"sparkles"`, `"spotify"`, `"star"`, `"star-half"`, `"star-off"`, `"stop-circle"`, `"store-01"`, `"sun-03"`, `"sun-cloud-02"`, `"sunrise"`, `"sunset"`, `"swimming"`, `"tag-01"`, `"target-02"`, `"temperature"`, `"tennis-ball"`, `"thermometer"`, `"thermometer-cold"`, `"thermometer-warm"`, `"threads"`, `"ticket-01"`, `"tiktok"`, `"time-quarter-pass"`, `"timer-01"`, `"tornado-02"`, `"train-01"`, `"tram"`, `"trophy"`, `"tropical-storm"`, `"tsunami"`, `"user-02"`, `"user-group"`, `"user-love-01"`, `"vegetarian-food"`, `"volleyball"`, `"volume-high"`, `"vote"`, `"walking"`, `"warehouse"`, `"waves"`, `"whatsapp"`, `"wheat-off"`, `"wifi-01"`, `"wifi-full-signal"`, `"wifi-lock"`, `"wrench-01"`, `"yen"`, `"youtube"` | An icon centred on a paper knock-out pad; null for none. Raises ECC to Q (H when large). |
| `logoScale` | string | `"small"` | `"small"`, `"large"` | |
| `frame` | string | `"none"` | `"none"`, `"card"`, `"ticket"`, `"badge"` | A frame carrying the call to action. |
| `textless` | boolean | `false` | | Code only: no caption, detail, label or call to action, in every view. |
### Dynamic properties
| Name | Type | Default | Values and limits | Description |
| --- | --- | --- | --- | --- |
| `value` | string | `""` | maxLength: `1024` | A raw payload. When set it wins over `action`. |
| `action` | object | | additionalProperties: `false` | Builds the payload when `value` is empty. Fields by type: url {url, utm}; phone {number}; sms {number, message}; email {to, subject, body}; wifi {ssid, password, security, hidden}; vcard {first, last, org, title, phone, email, url, address}; event {title, start, end, location, description}; geo {latitude, longitude, label}; whatsapp {number, message}; social {network, handle}; review {placeId}; app {ios, android}; text {text}. |
| `action.type` | string | | `"url"`, `"phone"`, `"sms"`, `"email"`, `"wifi"`, `"vcard"`, `"event"`, `"geo"`, `"whatsapp"`, `"social"`, `"review"`, `"app"`, `"text"`; Required | |
| `action.url` | string | | maxLength: `1024` | |
| `action.utm` | object | | additionalProperties: `false` | |
| `action.utm.source` | string | | maxLength: `100` | |
| `action.utm.medium` | string | | maxLength: `100` | |
| `action.utm.campaign` | string | | maxLength: `100` | |
| `action.utm.content` | string | | maxLength: `100` | |
| `action.utm.term` | string | | maxLength: `100` | |
| `action.number` | string | | maxLength: `40` | |
| `action.message` | string | | maxLength: `300` | |
| `action.to` | string | | maxLength: `200` | |
| `action.subject` | string | | maxLength: `200` | |
| `action.body` | string | | maxLength: `600` | |
| `action.ssid` | string | | maxLength: `64` | |
| `action.password` | string | | maxLength: `64` | |
| `action.security` | string | | `"WPA"`, `"WEP"`, `"nopass"` | |
| `action.hidden` | boolean | | | |
| `action.first` | string | | maxLength: `80` | |
| `action.last` | string | | maxLength: `80` | |
| `action.org` | string | | maxLength: `120` | |
| `action.title` | string | | maxLength: `120` | |
| `action.phone` | string | | maxLength: `40` | |
| `action.email` | string | | maxLength: `200` | |
| `action.address` | string | | maxLength: `300` | |
| `action.start` | string | | maxLength: `40` | |
| `action.end` | string | | maxLength: `40` | |
| `action.location` | string | | maxLength: `200` | |
| `action.description` | string | | maxLength: `600` | |
| `action.latitude` | number | | minimum: `-90`; maximum: `90` | |
| `action.longitude` | number | | minimum: `-180`; maximum: `180` | |
| `action.label` | string | | maxLength: `120` | |
| `action.network` | string | | `"instagram"`, `"facebook"`, `"x"`, `"linkedin"`, `"tiktok"`, `"youtube"`, `"threads"` | |
| `action.handle` | string | | maxLength: `80` | |
| `action.placeId` | string | | maxLength: `200` | |
| `action.ios` | string | | maxLength: `1024` | |
| `action.android` | string | | maxLength: `1024` | |
| `action.text` | string | | maxLength: `1024` | |
| `caption` | string | `""` | maxLength: `80` | |
| `detail` | string | `""` | maxLength: `120` | Small line under the caption; empty shows the value when it is a URL. |
| `cta` | string | `""` | maxLength: `40` | Call to action; a frame with none says "Scan me". |
## Canvas example
Add this item to a playlist page’s `primitives`. [Publish the playlist and assign a screen](/docs/cards/#publish-a-card-canvas).
```json
{
"id": "qr-code",
"primitive": "card",
"card": "qr-code",
"major": 1,
"params": {
"theme": "neomustard"
},
"rect": {
"x": 0,
"y": 0,
"width": 1920,
"height": 1080
},
"layer": 0,
"content_fit": "fill",
"data": "qr-code-main"
}
```
## Write live data
Create this document before showing the card, then replace it to update the screen without republishing. Use the same project as the playlist. Supply your API authorization through the environment; see [API authentication](/docs/authentication/).
```console
curl --request PUT "https://api.screenrig.ai/api/card-data/qr-code-main" \
--header "Authorization: Bearer $SCREENRIG_TOKEN" \
--header "ScreenRig-Project: $SCREENRIG_PROJECT" \
--header "Content-Type: application/json" \
--data '{"document":{"value":"","action":{"type":"url"},"caption":"","detail":"","cta":""}}'
```