ASCII Art 轉 SVG
在瀏覽器中把 ASCII Art、文字圖表、線框圖和字符圖形轉換為清晰的 SVG 檔案。 瀏覽器內快速處理，保護隱私，免費使用，無需註冊。
ASCII 輸入
這個工具最適合 ASCII Art、流程圖、線框圖、終端草圖和依賴等寬字符排版的文字圖表，核心目標是盡量保留原始 ASCII 佈局結構。
SVG 實時預覽
導出工具
SVG 輸出
如何把 ASCII Art 轉成 SVG
如果你已經有一份文字版圖表，這個流程可以幫助你快速生成適合分享的圖片結果。
-
1
粘貼 ASCII 圖表
把流程圖、線框圖、終端草圖或字符圖形粘貼到輸入區域。
-
2
調整字體與邊距
根據實際使用場景設置字號、邊距、文字顏色和背景顏色。
-
3
生成 SVG 預覽
點擊轉換按鈕後，右側會立即渲染出 SVG 預覽和對應的 SVG 代碼。
-
4
複製或下載結果
你可以直接複製 SVG 源碼，也可以下載 SVG 或 JPEG 檔案用於後續工作流程。
為甚麼使用這個 ASCII Art 轉 SVG 工具？
這個頁面圍繞最核心的搜尋需求來設計：把文字圖表快速轉成可復用的矢量圖，同時盡量不破壞原始 ASCII 的排版結構。
保留等寬排版結構
字符間距和文字佈局會盡量保持一致，讓盒子、箭頭和標籤在轉換後依然清晰可讀。
輸出清晰 SVG
導出的 SVG 適合文檔、演示、網頁和設計交付場景，放大後也不會像位圖那樣失真。
瀏覽器內直接運行
渲染過程在本地完成，不依賴上傳步驟，速度更直接，使用門檻也更低。
ASCII Art 轉 SVG 常見問題
下面這些問題，基本覆蓋了文字圖表轉 SVG 過程中最常見的需求和顧慮。
甚麼類型的 ASCII 圖最適合轉換？
為甚麼要先轉成 SVG，而不是直接導出 PNG？
這個工具也支援下載位圖嗎？
ASCII 轉 SVG 的過程是否在本地完成？
轉換後能否盡量保留原始間距？
畫圖表時應該使用哪些框線字元？
我想要可以編輯的圖表，而不是一張圖片，該用哪個工具？
關於這個 ASCII 轉 SVG 轉換器
這個頁面主要服務一種非常實際的需求：把 ASCII 圖表轉換為 SVG，而不必再去設計工具里重畫一遍。如果你習慣用純文字先畫流程圖、架構草圖、終端界面或輕量線框圖，這個工具可以把文字草稿快速變成可復用的矢量資源。
甚麼場景適合用 ASCII 圖表轉 SVG
常見場景包括開發文檔、內部 Wiki、技術部落格、演示文稿、Issue 討論、Markdown 筆記和新員工 onboarding 文檔。它能保留文字草圖的速度優勢，同時讓成品更適合展示和分享。
讓 ASCII 轉 SVG 輸出更穩定的技巧
- 在轉換前先確保原始圖表已經適合等寬字體閱讀。
- 適當增加邊距，避免箭頭和邊緣文字在最終圖片里顯得太擠。
- 選擇足夠對比的前景色和背景色，提升文檔和演示中的可讀性。
- 只有在目標背景可控時才建議使用透明背景。
- 如果後續場景更偏圖片傳播，可以直接導出 JPEG。
適用範圍與限制
這個工具的重點是保留文字排版並把它乾淨地導出為 SVG，而不是把 ASCII 圖語義化重建成真正的流程圖對象。這樣的範圍更可控，也更接近大多數用戶對“ASCII 轉 SVG”這個關鍵詞的真實需求。
框線字元參考
文字圖表由 Unicode 框線字元區塊組成。下列每個字元在等寬字型中恰好佔一欄 — 這就是轉換後方框不會破格、箭頭不會跑版的原因。
| Characters | Role | Typical use |
|---|---|---|
| ┌ ┐ └ ┘ | 四角 | 畫出方框的四個角：上緣 ┌────┐，下緣 └────┘。 |
| ─ │ | 線段 | 水平與垂直筆畫；重複拼排即可決定方框尺寸（│ Side │）。 |
| ├ ┤ ┬ ┴ ┼ | 交叉點 | T 形接點與線條交會處，例如 ─┼─ 或 ├──┤。 |
| --> ==> -> | 箭頭 | 水平流向箭頭；==> 通常標示重點或非同步步驟。 |
| v ^ | | 垂直流向 | 步驟之間的下行：│ 線下方單獨一個 v 讀作「向下」。 |
| :: == ~~ | 虛線樣式 | 用於分組、註記與泳道的點狀或雙線分隔。 |