html.to.design
Convert any website into fully editable Figma designs. Requires the associated Figma plugin!
什麼是html.to.design？
html.to.design是由chrome-webstore開發的Chrome擴展程式，該擴展的主要功能是“Convert any website into fully editable Figma designs. Requires the associated Figma plugin!”。
擴展截圖
下載html.to.design擴展crx文件
下載html.to.design擴展crx格式的文件，手動將Chrome擴充功能安裝到瀏覽器中，也可以將crx文件分享給朋友，輕鬆安裝Chrome擴充功能。
擴展使用說明
With html.to.design, convert any website into fully editable Figma designs. Even private webpages behind a log-in ✨ Leverage an existing website and import its html to Figma to start your own designs, without building each element from scratch.
Before going any further, please note that this Chrome extension is a companion to the html.to.design Figma plugin, and you’ll need to install the Figma plugin first.
How it works:
1. Install the html.to.design Chrome extension by clicking on ‘Add to Chrome’.
2. Navigate and log in to the page you would like to import into Figma. (This extension is especially designed for private pages behind a log-in. To import a public website, you can use our Figma plugin without the need for the Chrome extension).
3. Click on the html.to.design extension icon in your Chrome top bar.
4. The extension will automatically start extracting html from the page. (You’ll see the following message in your browser: `html.to.design started debugging this browser`. Don’t worry, this means everything is working as expected.)
5. Once the download is complete, head over to Figma and launch the html.to.design plugin.
6. You’ll see a big box where you can directly drag and drop the file generated and downloaded by the Chrome extension.
7. html.to.design will immediately start importing the page into Figma, and you’re all set!
8. Happy designing!
-------
Powered by story.to.design technology 🚀
-------
Notes:
- In order to best map what you see in your browser to Figma, we need to access Chrome's debugging features.
- We don't store or log anything outside of your browser. Everything stays local, we might add anonymous analytics in the future.
- Keep in mind that this Chrome extension is still work in progress, and while we strive for pixel-perfect, it may not always be there yet.
Thank you for your support and patience. 擴展基本資訊
| 名稱 |  html.to.design |
| ID | ldnheaepmnmbjjjahokphckbpgciiaed |
| 官方網址 | https://chromewebstore.google.com/detail/htmltodesign/ldnheaepmnmbjjjahokphckbpgciiaed |
| 簡介 | Convert any website into fully editable Figma designs. Requires the associated Figma plugin! |
| 檔案大小 | 278 KB |
| 安裝次數 | 192,243 |
| 目前版本 | 0.0.89 |
| 更新時間 | 2024-03-01 |
| 上架時間 | 2022-11-13 |
| 評分 | 4.58/5 共 43 次評分 |
| 開發者 | chrome-webstore |
| 電子郵箱 | [email protected] |
| 付費類型 | in_app |
| 擴展官網 | https://html.to.design |
| 說明頁面URL | https://html.to.design/chat |
| 隱私政策頁面URL | https://html.to.design/privacy |
| 支援的語言 | en |
| manifest.json | |
{
"update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
"author": "\u2039div\u203aRIOTS",
"description": "Convert any website into fully editable Figma designs. Requires the associated Figma plugin!",
"name": "html.to.design",
"version": "0.0.89",
"icons": {
"16": "icons\/16.png",
"19": "icons\/19.png",
"32": "icons\/32.png",
"38": "icons\/38.png",
"48": "icons\/48.png",
"64": "icons\/64.png",
"96": "icons\/96.png",
"128": "icons\/128.png"
},
"permissions": [
"activeTab",
"scripting",
"debugger",
"downloads",
"storage",
"webNavigation"
],
"action": {
"default_icon": {
"16": "icons\/16.png",
"19": "icons\/19.png",
"32": "icons\/32.png",
"38": "icons\/38.png"
},
"default_popup": "src\/entries\/popup\/index.html"
},
"background": {
"service_worker": "serviceWorker.js",
"type": "module"
},
"host_permissions": [
"*:\/\/*\/*"
],
"manifest_version": 3,
"commands": {
"capture-full": {
"suggested_key": {
"default": "Shift+Alt+E"
},
"description": "Capture full page."
},
"capture-selection": {
"suggested_key": {
"default": "Shift+Alt+D"
},
"description": "Capture selection."
}
}
} | |
