There's a cool new feature in Chrome. It's in the "experimental" features so it's still in development.
Steps to activate it you:
- Open the dev tools -
Command+Option+Ion Mac &Control+Shift+Ion Windows. - Click the settings button (it looks like a big cog).
- Click the "Experiments" tab.
- Check the "CSS Overview" option. ✅
- Close the menu (and you may need to reopen the dev tools).
- Check out a shiny new "CSS Overview" tab.
Now to use it all you have to do is click "Capture Overview" to get the overview of any page.
I hope this tip helped and until the next one, happy coding! 💜
Subscribe on Codú Community
Top comments (10)
Just to add, you'll need to enable the flag for dev tools experiments. chrome://flags/#enable-devtools-ex...
I didn't see anything to enable this so this awesome! Thanks for sharing
Wow, this is awesome!
That's a new feature I didn't know about, and looks pretty cool, thanks for that!
Awesome!
Cool, thanks for sharing Niall (and Jhey). Reminds me of cssstats.com/.
Oh nice, I never saw this before!
Cool.
That "unused declarations" is probably going to be so useful for me lol
Can anyone help me there is no CSS OVERVIEW option for me to tick on it in experiments section. I want this feature real bad, please help me