前端開發 - TechMoon 科技月球

TechMoon 科技月球

WordPress、SEO 與 AI 工具實測指南

TechMoon 精選圖｜Screenshot to Code 截圖轉程式碼工具，畫面截圖轉成前端程式碼並分成自架與雲端兩條路線

Screenshot to Code 把截圖、螢幕錄影或文字描述轉成六種技術棧的前端程式碼，GitHub 上近 8 萬顆星。但開源的是自架引擎那一半：官方雲端是接閉源後端的訂閱服務，月費 15 美元起、credit 不滾存不退款。本文整理兩條路的成本結構、模型組合與隱私邊界。

pen.dev 是什麼？網頁變圖層、改完送回程式碼的 AI 設計畫布

TechMoon 精選圖｜pen.dev AI 設計畫布：網頁一鍵匯入成可編輯圖層，改完匯出程式碼

Pencil.dev 在 2026 年 9 月 17 日改名 pen.dev 重新出發：內建瀏覽器可把任何網頁或 localhost 專案匯入成可編輯向量圖層，Script 節點直接在畫布跑 JavaScript，pen.dev 本身是 MCP 伺服器讓 Claude Code、Cursor 直接讀寫畫布，設計可匯出 HTML 與 Tailwind。定價頁目前標明免費，獲 a16z speedrun 支持。

Everysize：免費響應式網頁測試工具，多種裝置寬度一頁並排

TechMoon 精選圖｜響應式網頁測試工具的概念視覺：一個瀏覽器視窗裡並排多個不同寬度的裝置預覽框，從手機到桌面斷點，同一個網頁在每個框裡呈現不同版面配置

Everysize 是 Kiba Labs 的免費網頁工具，把多種裝置寬度的 iframe 並排在一個分頁裡檢查響應式版面，免安裝免註冊，自訂儀表板存在瀏覽器本機。實際打開線上版與原始碼會發現：核心預覽今天仍可用，但裝置清單停在 2020 年、兩個後端串接已經回 422、被擋網站的錯誤提示永遠不會出現，倉庫也沒有授權條款，最適合拿來測自己開發中的 localhost 網站。