itouQR

專案介紹

itouQR 是一個以 HTML、CSS 與 JavaScript 製作的 QR Code 產生器。編碼、預覽與匯出都在瀏覽器裡完成，輸入的文字或網址不需要傳到伺服器處理。

外觀與匯出

• 輸入內容後即時預覽，可切換方形、圓角、圓點與菱形模組。
• 調整容錯等級、匯出尺寸與留白邊界。
• 使用站內 HSV 調色器設定前景、背景與透明度，也能直接輸入色碼。
• 半透明或全透明背景會以棋盤格預覽，方便放進其他設計。
• 下載 PNG／SVG，或把圖片複製到剪貼簿。

渲染與操作設計

QR 編碼採用 qrcode-generator，圖形繪製與幾何計算則自行實作。Canvas 預覽和 SVG 匯出共用同一份計算，讓形狀、顏色與留白保持一致；定位圖標也有獨立處理，維持可辨識的結構。

調色器保留色相、飽和度、明度與透明度的狀態，拖到純黑、純白或透明時也不會遺失原本的色相。介面另提供對比提醒，幫助檢查樣式設定。

不同螢幕上的使用方式

桌機版將輸入與選項放在左邊，右邊的預覽跟隨捲動；手機則依「輸入、預覽、選項」排列，輸入後就能看到結果。深淺主題偏好會保存在裝置上，整個專案也能直接以靜態檔案開啟或部署。