Web Design Pirate for DevTools

Web Design Pirate is a Firefox 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.