Fast and easy way to copy web components, HTML widgets and parts of website design.
Web Design Pirate Extension
Web Design Pirate is a Chrome DevTools extension that allows you to select an HTML node, and then gives you only the CSS styles that you need to render the full component (subtree).
Optionally, for copying wrapper-style components it also allows you to specify the level of inner HTML content that can be thrown away (to further reduce the number of needed CSS styles).
You will get a new tab called Pirate in your Chrome DevTools. If you inspect an HTML element on the page using the regular Elements tab, then switch over to the Pirate tab, that element will be automatically selected.
Read more
Optionally, for copying wrapper-style components it also allows you to specify the level of inner HTML content that can be thrown away (to further reduce the number of needed CSS styles).
You will get a new tab called Pirate in your Chrome DevTools. If you inspect an HTML element on the page using the regular Elements tab, then switch over to the Pirate tab, that element will be automatically selected.
Source Manifest.json
{"update_url": "https://clients2.google.com/service/update2/crx", "manifest_version": 2, "name": "Web Design Pirate", "version": "1.5", "description": "Fast and easy way to copy web components, HTML widgets and parts of website design.", "devtools_page": "src/devtools.html", "background": { "persistent": false, "scripts": ["src/background.js"] }, "permissions": [ "" ], "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'", "icons": { "128": "images/icon128.png", "48": "images/icon48.png" }, "author": "Dalimil Hajek"}
Read more