A curated collection of powerful browser extensions designed to streamline the workflow of web developers. From debugging and testing to accessibility and code quality, these tools enhance productivity and ensure robust, accessible, and high-performance web applications.
Get targeted exposure with custom position pinning and highlighted placement.
The official React debugging extension for Chrome and Firefox. It allows developers to inspect the React component hierarchy, view props and state, and identify performance bottlenecks in React applications, making it indispensable for front-end development.
A browser extension for debugging Vue.js applications. It provides a dedicated UI to inspect the Vue component tree, view reactive data, and trace events, significantly simplifying the debugging process for developers working with the Vue ecosystem.
A powerful extension for debugging and testing Redux applications. It offers time-travel debugging, action history tracking, and state diffing capabilities, allowing developers to understand exactly how state changes over time in complex applications.
An information-gathering tool that identifies web technologies used on websites. It detects content management systems, web servers, analytics tools, and JavaScript frameworks, providing quick insights into the technology stack of any site.
An automated tool for improving the quality of web pages. It runs audits for performance, accessibility, progressive web apps, SEO, and best practices, generating detailed reports with actionable recommendations to enhance web page quality.
Adds a toolbar button to the browser with various web developer tools. Features include disabling JavaScript or images, outlining elements, displaying form details, and managing cookies, serving as a versatile all-in-one toolkit for debugging.
A tool that improves the way JSON data is viewed and formatted in the browser. It offers syntax highlighting, collapsible tree structures, and the ability to search through JSON data, making API response analysis much easier and more intuitive.
An advanced eyedropper, color picker, and gradient generator tool. It allows developers to extract color values from any part of a webpage, preview color combinations, and create CSS gradients, streamlining the design and implementation process.
A tool for inspecting and extracting CSS styles, images, and fonts from web pages. It allows developers to preview fonts, copy CSS snippets, and view responsive design states, facilitating faster design implementation and consistency checks.
A design and development tool that lets you visually edit web pages in the browser. It provides a visual interface to modify HTML and CSS properties, adjust layouts, and test designs directly without needing to switch between code and browser.
A set of tools to help developers quickly find and fix accessibility issues. It provides automated testing and manual guidance to ensure websites are accessible to people with disabilities, helping to meet WCAG compliance standards.
A developer tool that draws a bold red outline around all DOM elements on a page. This visual aid helps developers quickly identify layout structures, inspect element boundaries, and troubleshoot CSS issues affecting positioning and spacing.
A browser extension that adds a GitHub code tree sidebar. It allows developers to browse and navigate through GitHub repositories easily, viewing file structures and code contents without downloading the entire repository or leaving the browser.
A simple extension that displays HTTP status codes directly in the browser's address bar. It provides immediate visual feedback on the status of requests, helping developers quickly identify and troubleshoot server errors or redirects during development.
A tool to quickly clear browser cache, cookies, and other data. It simplifies the process of refreshing stored data, ensuring that developers always see the latest version of assets and do not get stuck with outdated cached files.
An extension that integrates Bitbucket repositories directly into the browser. It allows developers to view code, manage pull requests, and browse repositories without leaving their current workflow, enhancing productivity for teams using Bitbucket.
A modular linting engine that helps developers build better web experiences. It scans websites for various issues related to accessibility, security, performance, and interoperability, providing actionable feedback to improve overall web quality.
A powerful API development and testing tool. It allows developers to create, send, and manage API requests, inspect responses, and automate testing workflows, serving as an essential tool for backend and frontend API integration.
An extension specifically for debugging Vue Router. It visualizes the current route, provides history of navigations, and allows developers to inspect and manipulate router state, aiding in the development of complex single-page applications.
An extension for debugging and profiling Angular applications. It provides a dedicated UI to inspect the component tree, view bindings, and analyze performance, helping developers optimize Angular applications for better user experience.