QR Code

fandhe-frontend-pre-styled-ui の qr_code mod が提供するスタイル済み QR Code 部品です。

Demo

外部依存ゼロの QR Model 2（ISO/IEC 18004）byte モードエンコーダによる QR コード表示。size（xs/sm/md/lg/xl）で --fandhe-qr-code-size を切り替えます。Overlay パーツは frame 中央に固定サイズ（--fandhe-qr-code-size の 1/3）で重なり、背景・角丸付きでロゴ等の呼び出し側コンテンツの可読性を確保します。

Size

Features

外部依存ゼロの QR Model 2（ISO/IEC 18004）byte モードエンコーダによる QR コード表示
size（xs/sm/md/lg/xl）で --fandhe-qr-code-size を切り替える
Overlay パーツは frame 中央に --fandhe-qr-code-size の 1/3 幅で固定され、背景・角丸付きでロゴ等の呼び出し側コンテンツの可読性を確保する

Anatomy

root
  frame
    pattern
  overlay

API Reference

Arguments

Name	Type	Default	Description
`size`	`Size`	`Md`	寸法 variant。
`encode(data, level)`	`fn(&str, ErrorCorrectionLevel) -> Result<Matrix, QrError>`	—	文字列を QR コード行列へエンコードする（headless-ui 側の純粋関数）。

CSS Variables

Variable	Default
`--fandhe-qr-code-overlay-size`	—
`--fandhe-qr-code-size`	—

Examples

size 5 段

同一 URL を xs/sm/md/lg/xl で表示します。

overlay 付き

ロゴ等を中央に重ねる場合の表示です。読み取り精度を確保するため error correction level は Q 以上を推奨します。