Piny

Piny 面向現今常見的開發流程：AI 程式代理先搭建頁面與邏輯，接著需要人工微調間距、字體與文案，而不必為每一個像素重新下提示詞。Piny 以開發相依套件與 Vite 外掛的形式安裝，在應用旁開啟可視化編輯器，點擊任意元素即可選中渲染它的 JSX。在這裡你可以使用專案自身的主題，在各種斷點與狀態下調整 Tailwind 的間距、顏色、字體、flex 與 grid 控制項，編輯文字、圖片與連結，並檢視元素及其父層的類別樹。

由於 Piny 直接編輯原始碼而非產生覆蓋層，這些改動就是一般的程式碼變更：你的代理能辨識，也不會有任何內容進入正式建置。如果你的代理在你用 Piny 編輯某檔案的同時也修改它，Piny 會偵測到變化並避免覆蓋。「Target this element」功能會複製元素的元件、檔案與行號，方便你在下一輪提示中把代理精準指向該位置。

Piny 出自 Pinegrow Web Editor 團隊，但它是獨立產品，擁有自己的授權體系。它提供真正可用的免費版，無需帳號、沒有時間限制——點擊選取、元件樹、內容編輯、多頁面檢視、復原與重做。Pro 版增加 Tailwind 與 Grid 控制項、類別檢查器、結構與 props 編輯、用於頁面文字與資料的 Content Workspace，以及可註冊自有元件的元件庫（附預覽與預設）。目前支援的專案是基於 Vite 5.2 或更新版本的用戶端渲染 React；Astro 支援開發中，Next.js 尚不支援。