qr-code
Work with QR code generation and display. Use when modifying QR functionality, fixing QR rendering, or adding QR features.
ソース情報
- リポジトリ
- HKTITAN/kheMessage
- ソースの最終更新活動
- 2026年2月1日 11:49
- 検出された SKILL.md の言語
- 英語
- スター
- 1
- フォーク
- 0
インストール方法
デフォルトでは、最初にソースを確認する Prompt が選択されています。直接コマンドに切り替えるか、ローカルコピーをダウンロードすることもできます。
ソースファイルを確認
インストールを決める前に、SKILL.md と SkillsMP に表示されている付属ファイルをお読みください。
SKILL.md を表示中
SKILL.md
ソースの指示 · 読み取り専用プレビュー- name
- qr-code
- description
- Work with QR code generation and display. Use when modifying QR functionality, fixing QR rendering, or adding QR features.
# QR Code Skill
Work with QR code generation and display in kheMessage.
## When to Use
- Modifying QR code appearance
- Fixing QR code rendering issues
- Adding QR code features
- Optimizing QR code size
## QR Code Pages
1. **Bottom-right panel** - Small QR in main editor
2. **Full-page QR** - `/qr` or `qr.html`
## Implementation
Uses `qrcode.js` library:
```javascript
function updateQR() {
const el = document.getElementById('qrcode')
if (!el || typeof qrcode !== 'function') return
const url = location.href
try {
const qr = qrcode(0, 'L') // Type 0, Error correction L
qr.addData(url)
qr.make()
el.innerHTML = qr.createSvgTag({ cellSize: 4, margin: 0 })
} catch (e) {
el.innerHTML = ''
}
}
```
## Error Correction Levels
- `L` (7%) - Currently used, smallest size
- `M` (15%) - Medium
- `Q` (25%) - Higher reliability
- `H` (30%) - Highest reliability
## Theme Support
QR colors adapt to theme:
```css
html.dark #qrcode svg rect {
fill: #292524; /* Background */
}
html.dark #qrcode svg path {
fill: #fafaf9; /* Modules */
}
```
## QR Size Limits
- QR codes have capacity limits based on version and error correction
- Very long URLs may fail to generate
- Consider using URL shortener for extremely long content
## Styling
The QR container has consistent styling:
```css
#qrcode-wrap {
background: var(--bg-elevated);
border: 1px solid var(--border);
border-radius: 12px;
padding: 12px;
box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
}
```
GitHubで見る