Detailed CSS Inspector on Every Site with CSSPeeper for Chrome

The unchanging Chrome DevTools row is crazy powerful. It lets anyone dive low into any page to investigate a site’s layout, CSS, and even HTTP headers if needed.

You can do a lot with a DevTools CSS inspector. But it doesn’t have a transparent GUI row and that’s one thing any developer would love.

Check out CSSPeeper, a giveaway Chrome prolongation that adds this GUI examiner to your browser. It lets we investigate a CSS properties of any component on any page, nonetheless it’s usually built for Chrome right now.

Once commissioned we only visit a webpage and click a extension’s categorical button in a Chrome add-ons bar. A new examiner window appears on tip of a webpage with sum about any categorical element.

As we crop by a site we can click on any component we see with a dotted outline. This can embody buttons, page sections, headers, navigation items, we name it.

csspeeper examiner extensioncsspeeper examiner extension

From there you’ll get a whole examiner with sum on a typography, tone choices, and rise styles. It’s a good approach to pull styles directly from a webpage but digging into a CSS formula yourself.

CSSPeeper even lets we pick associated colors with a built-in tone picker and color intrigue generator. You can trade images from pages, build your possess tone schemes, and apply these into your possess mockups with Photoshop or Sketch.

csspeeper chrome prolongation previewcsspeeper chrome prolongation preview

I essentially recommend this prolongation for designers instead of developers as it’s a most some-more designer-friendly plugin that pulls tender CSS and transforms a formula into easy-to-read chunks of data.

But this plugin can also assistance developers too! It’s unequivocally a powerful site investigation apparatus for all forms of CSS.

Take a demeanour during the CSSPeeper homepage to learn some-more about what it can do. The categorical page also includes a couple to a Chrome store so we can install a extension giveaway of assign and take it out for a exam run.

Add Comment