CSS Scan Pro makes browsing CSS websites much easier. Just hover over any element and instantly get its colors, resources, animations, fonts and sizes. Copy, export or retrieve data with it without having to dig into the source code.
Built to work on any website
CSS Scan Pro works in your browser as an extension. It works on all types of websites: WordPress, Shopify, React, Wix, all themes, anything. Works even if the site is not yours . No code modification required and it works offline. The thing I was most pleased about the tool is that it supports Safari.
Features:
- Check CSS on the fly;
- Concise, optimized and clean CSS: code that is easy to understand;
- Color preview and syntax highlighting;
- Determine which font is being used;
- Check element dimensions;
- Check HTML attributes;
- Copy all pseudoclasses (: hover,: focus, etc.);
- Copy all pseudo elements (: before,: after, etc.);
- Copy the CSS and HTML of the element and all its child elements;
- Copy the CSS animation of @keyframes;
- Copy the CSS selector (classes, identifiers and unique selectors);
- Export the element to Codepen or save it as a file;
- Check alignment in real time with recommendations;
- Redirect the selected element using DOM tree navigation;
- Media Query Support.
Easily customize the CSS of any element and observe changes in real-time and seamlessly.
- Visual editor: change and add styles interactively, without writing CSS code;
- Code editor: with syntax highlighting and color pickers;
- Quickly experiment with design customizations in real time;
- Edit everything including pseudo classes, pseudo elements and @keyframes;
- This tool has everything you can think of: ruler, dropper, editor and more. It’s better to see it once;
- Developers will definitely appreciate it, and so will designers.
