任務路徑 / 從輸入到結果
如何把程式碼變成可分享的圖片
- 01
貼上程式碼
在「程式碼來源」輸入框中輸入或貼上程式碼：最多 65,536 個 UTF-8 位元組、200 行，每行不超過 240 個字元。標籤旁的計數器會即時顯示目前位元組數與上限。
- 02
選擇語言與主題
在「語言」下選擇 JavaScript、TypeScript、HTML、CSS、JSON 或 Bash，再把「主題」設為「淺色」或「深色」。語法配色來自對應的 Shiki 語法與 GitHub 風格主題。
- 03
設計外框
設定「背景」顏色、「內距」（16 到 96 px）和「字型大小」（12 到 28 px），再填寫不超過 80 個字元的「視窗標題」，按需切換「顯示行號」，並選擇 1x 或 2x 的「匯出比例」。
- 04
產生預覽
產生時載入本機斷詞器，測量實際字型和視窗標題，並預覽用於匯出的同一份跳脫 SVG。程式碼只作為文字，不會執行。修改設定會清除舊預覽，超限或無法測量的輸出會被拒絕；寬圖可用鍵盤捲動檢查。
- 05
下載 SVG 或 PNG
需要可縮放的向量檔案時點「下載 SVG」；需要點陣圖時點「下載 PNG」，PNG 會按所選比例透過 Canvas 渲染。兩種檔案都在本機產生。