We've tested CSS Scan, the fastest and easiest way to check and copy CSS
Welcome to this CSS Scan review 😊.
CSS Scan is a Chrome extension that allows you to quickly inspect the CSS of elements displayed on your page without having to open your devtools. It also lets you copy all the CSS of the element you're hovering over with just one click 🤩!
If you do a lot of front-end work, this tool is very appealing, but is it really worth it 🤔? As I start this review, I wonder if it can replace devtools when it comes to CSS.
Installing the extension is easy, and now it's time to test it on the Uneed website!
The first thing I do is pin the extension so I can access it easily. If you're using Arc, it will display like this:
Then I launch the extension on the Uneed website and WOW! Everything lights up as soon as I move the mouse: it’s extremely fast.
The selection is very well done, and it's very easy to switch from a parent element to a child element.
The window that pops up offers a lot of information:
It's very comprehensive, and most importantly, much quicker and simpler to access than via devtools. If you click, the CSS of the targeted element is directly copied to your clipboard. Super handy for grabbing bits of CSS here and there!
But 🤯 wait, it gets even better…
By exploring the extension's settings, you find a lot of features:
The UX of the extension is extremely well thought out, and I encounter no difficulties. Pretty impressive, it makes me want to do some integration work 😅.
If you're curious, I invite you to explore the settings to discover all the possibilities. Among other things, you can configure a lot of keyboard shortcuts!
💡 A nice little detail for those like me who don't like to remember 50 keyboard shortcuts: you can open the extension directly on an element by right-clicking and then selecting “Inspect with CSS Scan”!
This concludes our CSS Scan review 🙌🏻!
CSS Scan is a very handy extension, available as a one-time purchase. If you do a lot of CSS and integration work, you'll save a ton of time using CSS Scan instead of opening devtools every time.
If you want to go further, there's also CSS PRO, a much more comprehensive extension created by the same author.