9 Awesome Firefox Add-ons For CSS

Stylesheets are an integral part of any web design project these days. In order to create a great stylesheet, it is important to have the right CSS tools. What can be better than having the power of CSS right within your browser?

These Firefox add-ons allow you to view, edit and play with CSS without leaving your browser.

  1. CSS Mate: Offers easy inline CSS editing. Each stylesheet loads into a separate tab.
  2. EditCSS: Puts a stylesheet modifier in your sidebar.
  3. Font Finder: See  full CSS text styling of the selected element. Simply highlight a single element (e.g. a paragraph or a strong tag ), right-click and select `Font Finder`, then marvel as the full CSS text styling of the selected element appears.
  4. JSView: View the actual JS or CSS files behind any source code. If the website you are viewing contains any external js/css files, an icon will appear that says “SS”, “JS”, or both. Each individual file can then be viewed by clicking on the filename.
  5. Firefinder: Find HTML elements matching chosen CSS selectors.
  6. Dust-Me Selectors: Finds unused CSS selectors from a single web page or entire site. It extracts all the selectors from all the stylesheets on the page you’re viewing, then analyzes that page to see which of those selectors are not used. The data is then stored so that when testing subsequent pages, selectors can be crossed off the list as they’re encountered.
  7. CSS Validator: Validates a web page for CSS using the W3C rules. Adds an option to the right-click context menu and to the Tools menu to allow for easy validation of the CSS of the current page.
  8. Firebug: Allows you to edit, debug and monitor CSS, Html and JavaScript live for any web page.
  9. Mozile: A WYSIWYG tool for editing XHTML and XML+CSS.

Published by

Tehseen Baweja

Tehseen likes to write about Internet tools that make life easier. Check out his blog at Ijaar.com for more good stuff or follow him on Twitter @tehseenbaweja