Google Chrome
Free
- Clear Cache provides a one-click solution from your main tool bar for clearing one or more cached details including app, cookies, downloads, form data, history, local storage, and more. When you are doing development and testing, it would otherwise be a pain to have to manually navigate to the browser settings panel to access cache management tools.
- ColorPick Eyedropper takes the pain out of trying to find the exact formulas for colors displayed within individual pages.
- CSSViewer allows you to select individual elements within a page and see their exact style and position settings with ease. It’s a much faster way to find these configuration details vs. using the built-in inspector the browser offers.
- Ghostery is a privacy ad blocker that also enables you to view trackers installed on a page, this can come in handy when trying to review and debug digital marketing tracking codes across a variety of websites, platforms and ad partners.
- JSONView helps with viewing and validating your JSON content, data is extracted securely via the HTTP response
- Lorem Ipsum Generator (Default Text) lets us add as many placeholder sentences or paragraphs we need into web interfaces. This is a great prototyping tool for wireframes. In addition, it can be used across the web for any design or writing scenario.
- SEO Live Test by Franz Enzenhofer is a detailed SEO testing tool that allows you to easily evaluate pages while browsing.
- Session Manager let’s you create snapshots of sets of tabs you have open, enabling you to quickly and easily reopen them at a later date.
- Site Spider by Cliff Kilby allows you to quickly index individual page to check for broken links
- Wappalyzer makes it easy to identify details related to what CMS, online store, web server, analytics, and javascript frameworks in use on any website.
- Web Developer by Chris Pederick is a comprehensive toolbar add-on that with utilities for examining and troubleshooting code, images, responsive design, and more.
- Window Resizer makes it easy to resize your browser window to specific dimensions. This is helpful for testing and development of web pages. It also is useful for setting browser dimensions to a specific size for creation of web casts and training videos.
Paid
- actiTime is an extension that allows you to log and categorize time spent on tasks and projects, this paid extension is available as a web service or as a self hosted solution.
- Usersnap allows you to capture any web page and add annotations, which makes visual feedback and prototyping a breeze.
Microsoft Edge
Free
- CookieManager adds a toolbar button you can use to view and edit cookies related to the current page you are viewing.
- FireShot speeds up documentation and collaborations processes with its support for full or partial screen snapshots as well as the ability to automatically scroll and capture an entire web page.
- OneNote Web Clipper makes it fast and easy to select text and references and save them directly to OneNote for future reference as you are conducting research across the web. This is a great, free alternative to Evernote and makes the process of managing bookmarks, code snippets, details from tutorials much easier.
- Outline External Links adds a visual indicator to make it easy to see which links on a page based on if it is an external link and if it includes a nofollow attribute.
- Redirector is useful when you need to do cross-browser checking and testing. Simply select a link in the page you are viewing and choose to bounce the link over to any other web browser you have installed. No more having to copy a link, switch browsers, and paste the URL (which can get tedious when done as often as a web developer needs to).
- Sitemap Explorer makes it easy to find, inspect and export the XML sitemap file commonly used to list every page and/or asset on an individual website. The utility can validate the file, as well as export data to CSV file.
- User Agents allows you to set the user agent for individual tabs to emulate alternate browsers (e.g., Safari and Chrome) and devices (e.g., iPhones, iPads, Android, etc.) which can enable you to see what a site looks like when accessed from a different browser or device.
- WCAG Color Contrast Checker helps you to quickly assess the size and contrast of text on any web page and if the configuration complies with web accessibility and usability best practices.
Paid
- Web haven’t spotted any favorite paid options yet, but will add them here when we do.
Mozilla Firefox
Free
- BuiltWith is similar to Wappalyzer for Chrome, it automatically detects the underlying tools and software used by the website you are currently visiting. One added bonus is that is can display the Google Analytics ID of the selected page as well.
- ColorZilla adds advanced color picker and eyedropper functionality to Firefox.
- Cookie Manager is a streamlined utility for viewing, editing, deleting and searching for cookies created during a browsing session.
- Font Finder is a handy utility for designers, developers and typographers that lets you to quickly assess and adjust the CSS styles applied to any type element in a page.
- HTML Validator analyses a page and visually displays potential errors as you are browsing.
- iMacros brings automation to your Firefox browsing sessions. If you need to do a repetitive process like testing a form, extracting data, or downloading files, then this add-on is going to save you a lot of time.
- Measure-it lets you draw directly on a page to check the width, hight and alignment of page elements in pixels.
- OpenLorem allows you to quickly add placeholder text to the pages you are working on. An added bonus is support for alternative placeholder copy languages including Bacon Ipsum and Dino Ipsum (which is awesome).
- SEO Analysis & Website Review provides immediate and actionable feedback on how well a page has been optimized for searching and user experience.
- Stylus allows you to redesign your favorite websites using custom themes, existing remixes from online repositories, and more. You can edit and manage personalized CSS stylesheets as well.
- Tab2QR allows you to rapidly create a QR code from any page open in your browser. It includes multiple sharing and export options including SVG and PNG.
- Tampermonkey is a superscript manager used by millions that lets you review all of the scripts that are currently running on a page, what each does, and when they were last updated. The add-on supports customization for what level of detail to display and timing for automatic updates of scripts. It also comes with a built-in editor which makes modifications to a script for testing a snap.
- TinyEye Reverse Image Search helps you to discover where an image came from and where else it is being used. If a high resolution version is available, TinyEye will help you find it.
- Web Developer Checklist provides a super simple multi-point checklist developers can use to discover and address problems on websites.
Paid
- Evernote Web Clipper is an essential tool if you are organizing your notes, code and life with Evernote. It allows you to save entire web pages and articles or just the parts you need (i.e., you can filter out ads and other clutter), annotation of screenshots, and support for rich tagging and meta data.
- Octotree brings an IDE-like code tree to your browser where you can complete file and folder searches, access private repositories, use multiple GitHub accounts, and more.
Archive of retired and deprecated extensions
- Firebug was an essential tool for web developers and included robust support fore examining and modifying CSS, HTML, and JavaScript on live pages. This tool was integrated into Firefox Developer Tools.
- Live HTTP Headers was a Firefox extension developed by Daniel Savard along with contributions from Nikolas Coukouma that enabled web developers to see all HTTP requests and technical details in real-time. In addition, developers could record all events and triggers as a web page loaded and play them back step-by-step. A similar feature was later incorporated into Firefox, Chrome, and Edge and continues to be accessible under the network section of each browser’s respective web developer tools section.
