---
title: "Blade component — QR for Laravel | Roundly"
description: "Drop <x-qr-code> into any view — inline SVG or an img tag, with allow-listed attributes and no template compilation."
url: https://roundly-consulting.com/open-source/docs/qr-for-laravel/blade-component
language: en
---

[All packages](https://roundly-consulting.com/open-source.md)

[QR for Laravel](https://roundly-consulting.com/open-source/docs/qr-for-laravel.md)

# Blade component

The <x-qr-code> component renders any string or Payload inline, or as an <img> with a data URI:

```blade
<x-qr-code data="https://example.com" />
<x-qr-code :data="$payment" :size="200" :margin="2" error-correction="Q" foreground="#111111"
           background="#ffffff" title="Scan to pay" description="Invoice 2026-0042" class="mx-auto" />
<x-qr-code data="https://example.com" as="img" class="w-40" />
```

- Props — data (string or Payload), size, margin, error-correction, foreground, background, title, description, as (svg or img).
- Attributes are allow-listed (class, style, id, data-\*, aria-\*); anything else, such as onclick, is dropped.
- The generated markup is never compiled as a Blade template, so a title like {{ 7\*7 }} renders escaped and no compiled view is written per code.

## Renaming or disabling the tag

The tag name comes from qr.blade.component:

```php
'blade' => ['component' => 'qr-code'],   // <x-qr-code>; null or blank (not set) disables it
```

## Show your open-source love

This package is free and MIT-licensed. If it saves you time, a one-off donation or a Patreon membership keeps it maintained, tested and documented.

[More ways to support, including crypto](https://roundly-consulting.com/support-us.md)

By donating, you agree to our [donation terms](https://roundly-consulting.com/donation-terms.md).

[Support our open source work (opens in a new tab)](https://donate.stripe.com/dRmeVe8FX5PF1Qd9pXcEw00) [Join us on Patreon (opens in a new tab)](https://www.patreon.com/cw/roundly)

## Want this built into your product?

We integrate our packages into custom Laravel and AI builds. Tell us what you're working on and we'll reply within 48 hours.

[Get a quote in 48 hours](https://roundly-consulting.com/contact.md) [Browse all packages](https://roundly-consulting.com/open-source/docs/qr-for-laravel.md)