{"type":"video","version":"1.0","html":"<iframe src=\"https://www.loom.com/embed/6d493b679dd641c89486353312ea1bc5\" frameborder=\"0\" width=\"3908\" height=\"2931\" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>","height":2931,"width":3908,"provider_name":"Loom","provider_url":"https://www.loom.com","thumbnail_height":2931,"thumbnail_width":3908,"thumbnail_url":"https://cdn.loom.com/sessions/thumbnails/6d493b679dd641c89486353312ea1bc5-1709063762445.gif","duration":982.5,"title":"如何複製網頁中的 CSS 樣式直接轉換成 Figma 的設計圖：一款 Figma 外掛介紹","description":"🚀 想了解更多好用的網站設計外掛，前往閱讀「資深網頁設計師常用的 Figma Plugin 推薦 」，此影片教學也有嵌入到文章中：https://irvinglab.com/blog/figma-plugin/\n\n如影片所述，我想分享這款很棒的 Figma 外掛，叫做 Code to Design Playground：https://bit.ly/code-to-desgn-figma-plugin\n\n這個外掛的主要用途是將在 Chrome 開發者工具中複製的 CSS 樣式直接轉換成 Figma 的設計元素。我會在影片中示範如何使用這個外掛，讓你能夠更輕鬆地將網頁設計轉換成 Figma 設計。快來看看吧！\n\n-\n\n若你是 Figma 使用者、網頁設計師，那善用這些 Figma plugin大幅提升網頁視覺設計過程的執行效率、團隊協作的順暢、降低時間與跨部門的溝通成本，而且外掛的免費版本通常就夠用了！完全適用對象為網頁設計師、UIUX 設計師或本來就是用 Figma 來專案管理、腦力激盪發想、行銷工作的使用者等。想了解更多 Figma，前往了解更多：https://irvinglab.com/go/figma\n\n-\n\n🚀 Irvinglab 爾文實驗室電子報：歡迎來訂閱！\nhttps://irvinglab.com/newsletter/\n\n不定期分享滿滿的網站設計與建置相關的實戰經驗，包含設計觀點、Web UI/UX、SEO、Shopify 電商網站設計概念、WordPress 品牌形象網站設計訣竅、Shopify App 和 WordPress 外掛推薦與使用心得、行銷設計與程式開發、AI 軟體使用等實用內容"}