CSS Deconstructed

CSS Deconstructed CRX for Chrome

A Free Developer Tools Extension

Published By kabbnigam

Sponsored Links

CSS Deconstructed (inhlobcefhlmdljoeigpbpdehlpciohh): This extension breaks down then reapplies the CSS (one rule at at time) for a specific element... Read More > or Download Now >

CSS Deconstructed for Chrome

Download CRX


39.2 KB

Chrome Store

Tech Specs

  • • Type: Browser Extension
  • • Latest Version:
  • • Price: Freeware
  • • Offline: No
  • • Developer: kabbnigam

User Reviews

  • 2 Votes, Average: 5 out of 5
  • • Rating Average
  • 5 out of 5
  • • Rating Users
  • 2

Download Count

  • • Total Downloads
  • 7
  • • Current Version Downloads
  • 7
  • • Updated: July 23, 2016

CSS Deconstructed is a free Developer Tools Extension for Chrome. You could download the latest version crx file and install it.

Sponsored Links

More About CSS Deconstructed

CSS Deconstructed Screenshot Image
CSS Deconstructed is a tool for web developers to study the CSS of any given website. It allows users to remove all the styling for a specific element on a website and then re-apply the CSS rules one at a time at a speed of their preference. This tool provides valuable insight as to how different websites are constructed by visually building the site from scratch, right in front of your eyes.

How To Use:
- Inspect the HTML of a website you are interested in deconstructing.
- Choose the outer most selector that encompasses the part of the page you are interested in studying (**NOTE: If inspecting the whole page or a complex element, do note that it may take a while to rebuild.)
- Click the CSS Deconstructed Icon and enter in the selector, class, and/or ID.
- Choose how quickly you want each rule to be applied (often good to start with 10 ms)
- Click "Deconstruct!" to remove all CSS styling.
- Click "Build!" to re-apply each CSS rule.
- Watch your favorite site be rebuilt!

Download CSS Deconstructed

More Extensions to Consider (Similar or Related)