The vast majority of developers use Chrome as their preferred browser. W3Schools receives sixty million visits a month and over 80% of those come from Chrome. This should come as no surprise to anyone. The popular browser comes with a huge ecosystem of useful developer extensions. Here’s a list of the 25 most useful (and free) Chrome extensions for developers in 2021.
Extensions Manager
Before you start installing Chrome extensions left and right, you might want to consider Extensions Manager. This is a popup manager that lets you to enable or disable extensions, group them appropriately, and uninstall them easily. Useful if you want to install many extensions.
Session Buddy
Just like Extensions Manager helps you manage extensions, Session Buddy helps you manage browser tabs and bookmarks. You can save open tabs as collections to restore later, recover open tabs after a crash, see your open tabs in one place, and easily search through open tabs and collections.
Web Developer
Firefox is a great browser for developing, and Web Developer is the official Web Developer extension for Firefox. It adds a toolbar button to Chrome with various web developer tools. This extension helps streamline tasks for web developers and digital marketers.
Picture-in-Picture
Created by Google themselves, the Picture-in-Picture Chrome extension lets you watch videos in a floating window on top of other windows. Perfect if you’re watching a tech talk and want to keep an eye on what’s happening while also interacting with other websites.
ColorZilla
ColorZilla is an eyedropper, color picker, and gradient generator. A Firefox extension made available for Chrome, ColorZilla allows you to take the color of any pixel on any website. Additionally, ColorZilla keeps the color history of your recently picked colors and it has a webpage color analyzer that gives you the color palette of any site.
Window Resizer
Window Resizer helps you emulate various screen resolutions. Use this Chrome plugin to easily test your design layout on different browser resolutions. You can customize what resolutions you want displayed by changing the window's width, height, position, preset icon, and more. Also has the option to export your settings and import them on another computer.
CSSViewer
CSSViewer is a simple CSS property viewer (originally made as a FireFox add-on -- you might be seeing a theme here). It shows you all the CSS properties of the particular website you’re on when you click the extension.
Animo
Animo goes a step beyond CSSViewer. It allows you to write custom CSS for any website and see your changes in real-time. Customize a page’s colors, fonts, and even layout. You can sync your CSS to the cloud and see it on any desktop device where you’re signed into Chrome. Considered the best Chrome extension for previewing your custom CSS.
Wappalyzer
Wappalyzer identifies the web technologies used on any website. It detects content management systems, ecommerce platforms, web frameworks, server software, analytics tools and more. Alternatively, you can also visit the extension's official website, where you can search for any website and see what technology it uses.
Octotree
Octotree is a browser extension that makes code exploration and reviewing on GitHub much easier. It creates a fast IDE-like code tree on GitHub, quick file searches, multi-tab support and omni bookmarking. Used by over 400,000 developers.
CrxMouse Chrome Gestures
Make your mouse movements much more efficient with CrxMouse. Use mouse navigation shortcuts such as hold right-click and drag left to go back or hold right-click and drag right to go forward. You can also customize your own mouse movement to become even more productive.
Yet Another Lorem Ipsum Generator
This Lorem Ipsum Generator gives you lorem ipsum text that you can copy/paste directly into websites. Allows you to add paragraphs of variable length, titles, dates, email addresses, and mail addresses.
Fake Filler
Fake Filler fills all inputs on a page with fake/dummy data. If you’re a web developer who works with forms, this Chrome extension is a must-have. It eliminates the need to manually enter values in form fields and allows you to customize what type of fake data it puts in. The plugin also ignores any captcha, hidden, disabled, or read-only fields.
Clear Cache
Clear Cache does what it says on the tin. It clears your cache and browsing data with a single click. No popups or confirmation buttons. Simple, fast, and easy. You can customize how much data you want to clear and whether cookies should be removed globally, only for certain domains, or for everything except for certain domains.
PerfectPixel
PerfectPixel lets you overlay a semi-transparent image over a website, so you can perform a pixel-by-pixel comparison between the website and the image. If you’re a web developer or designer, this Chrome extension helps you create websites exactly like you’d modeled them.
Image Downloader
Image Downloader is a Chrome extension that seeks and downloads all the images from a particular webpage, even those that have been hidden from view. It displays a thumbnail of each image found on the page and gives you the option to download all of them or just a selection.
GoFullPage
GoFullPage captures a screenshot of your current page in its entirety without asking for any extra permissions. Given today’s long webpages, this one-click Chrome extension is particularly helpful for web developers who want to get a full overview of a webpage.
Fonts Ninja
Fonts Ninja shows you what fonts a website uses. The extension allows you to inspect, try, bookmark, and even buy the fonts of any website. It will give you any font’s name, size, line spacing, letter spacing, and its color. Invaluable for web developers.
Page Ruler Redux
Page Ruler Redux gives you a ruler to measure pixel dimensions and positioning. You can display the width, height, and position of any element on any website. This extension is open-source and a clean fork from another page ruler extension that was unfortunately malicious.
TinEye Reverse Image Search
TinEye is the first image search engine on the web to use image identification technology over keywords, metadata or watermarks. This extension finds exact matches, including those that have been cropped, edited, or resized. Using TinEye is private and free for non-commercial purposes. It doesn't save your search images.
FoxClocks
This one is for the remote developers. FoxClocks shows times around the world at the bottom of your browser. You can choose from a set of useful time formats or create your own. Particularly useful for scheduling meetings and understanding when your colleagues from around the world will come online.
Check My Links
Check My Links is a link checker that crawls through your website and looks for broken links. Particularly useful for websites with lots of links. The extension checks which links are valid and which ones are broken. It allows you to copy all bad links with one click. Use this if you’re a web developer who doesn’t want to pay for often expensive marketing tools.
Project Naptha
Project Naptha uses OCR technology so you can highlight, copy, edit, and translate text from any image on the web. It also allows you to erase the words from an image, edit them, and even translate them into a different language.
JSONView
JSONView lets you view and validate JSON documents in Chrome. Originally a FireFox extension that’s now been ported over. Makes a JSON file easily readable and automatically makes text links clickable.
daily.dev
Daily.dev is the number one Chrome extension if you want to stay updated on the latest programming news. It’s a news aggregator just for software developers that takes its input from hundreds of news sources. The extension is free, doesn’t need a sign-up, and 100% open source.
These were 25 useful Chrome extensions for developers in 2021. I hope you found at least one extension that will make your life just that little bit better.
Top comments (0)