DEV Community

Cover image for 9 Useful Chrome Extensions for Web Developers / Web Development
Snowie Wong
Snowie Wong

Posted on

9 Useful Chrome Extensions for Web Developers / Web Development

Hi there! Today I'm going to share with you 9 useful Google Chrome extensions that I use in my daily life as a web developer.

Introducing with Google Chrome Extensions


1. Wappalyzer

Have you ever wondered what's the tech stack of the website you're looking at? Wappalyzer is the perfect tool to analyze the technologies used on the websites, like whether the site has used Page Builder or not, and viewing information like the programming languages, JavaScript libraries or even payment processors used in the site.

Wappalyzer screenshot

This information is extremely valuable, especially when you are trying to learn how others build the websites you or your clients love, preparing for job interviews, or keeping up with the latest trend in technologies.

Link: https://chrome.google.com/webstore/detail/wappalyzer-technology-pro/gppongmhjkpfnbhagpmjfkannfbllamg


2. AdBlock

Time is valuable and this extension simply keeps you away from ads :)

AdBlock Screenshot

Link: https://chrome.google.com/webstore/detail/adblock-%E2%80%94-best-ad-blocker/gighmmpiobklfepjocnamgkkbiglidom


3. ColorPick Eyedropper

This tool is super useful and simple to use. Click the Eyedropper then click on any area on the website, it will show the exact color code used on that pixel. I always use it to check if my code applies the correct color, or to get the colors that I like from other websites, then save them in Coolors for future inspiration.

ColorPick Eyedropper Screenshot

Link: https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg


4. WhatFont

Similar to ColorPick Eyedropper, WhatFont is another handy tool used to check fonts applied on websites. One of the best ways to check your work or spy on the font family you love and save them down secretly :P

WhatFont Screenshot

Link:https://chrome.google.com/webstore/detail/whatfont/jabopobgcpjmedljpbcaablpmlmfcogm


5. GoFullPage

GoFullPage is an extension that helps capturing full page screenshots of websites. Sometimes I use that to capture some screenshots and show my work progress with my team and clients when the UAT site is not yet ready.

GoFullPage Screenshot

Link: https://chrome.google.com/webstore/detail/gofullpage-full-page-scre/fdpohaocaechififmbbbbbknoalclacl


6. Awesome Screenshot and Screen Recorder

This extension is absolutely awesome! It allows you to capture screenshots of visible parts, full page or just the selected area of the website. You can even choose to capture the screenshot after delay, which is extremely useful when your website has a looping animation that you only want a screenshot with a complete state of the animation. It also allows you to do screen recording and share it with a link. Useful for showing work progress or getting resources for building a portfolio.

Screenshot: Awesome Screenshot and Screen Recorder

Link: https://chrome.google.com/webstore/detail/awesome-screenshot-and-sc/nlipoenfbbikpbjkfpfillcgkoblgpmj


7. Lorem Ipsum Generator

This helps you to generate Lorem Ipsum conveniently, then you don't need to google 'Lorem Ipsum Generator' again and again when you don't want to use Emmet in VS Code.

Screenshot: Lorem Ipsum Generator

Link: https://chrome.google.com/webstore/detail/lorem-ipsum-generator/pglahbfamjiifnafcicdibiiabpakkkb


8. Image downloader - Imageye

Image downloader helps you download all images used on that webpage, so it's really helpful when your clients are too lazy / busy to export their image assets.

Screenshot: Image downloader - Imageye

Link: https://chrome.google.com/webstore/detail/image-downloader-imageye/agionbommeaifngbhincahgmoflcikhm


9. JSON Viewer

Reading raw JSON data returned from RESTful APIs could be a test on your eyesight. That's why JSON Viewer exists to help you read the JSON data in a readable format. Plus, you can change it to dark mode to make your eyes happier.

Screenshot: JSON Viewer

Link: https://chrome.google.com/webstore/detail/json-viewer/gbmdgpbipfallnflgajpaliibnhdgobh


That's all and I hope you guys enjoyed the list. Do you have other useful Chrome extensions in mind? Leave a comment below and let us learn about the hidden gem :)

Top comments (6)

Collapse
 
atinypixel profile image
Aziz Kaukawala • Edited

Thanks!

Here are few from my list:

  • Fake Filler: A form filler that fills all inputs on a page with fake/dummy data.
  • Screely: The Screely extension lets you instantly create a screenshot of the current webpage and opens it in Screely
Collapse
 
snowiewdev profile image
Snowie Wong

Nice Recommendation! Fake Filler looks really useful for testing forms :) Thanks bud!

Collapse
 
gamerseo profile image
Gamerseo

Great additions

Collapse
 
thebrown profile image
Saleumsack

Nice though

Collapse
 
bonacinto profile image
Cinto Bona • Edited

My favorite for controlling video speed

Collapse
 
mmuller88 profile image
Martin Muller 🇩🇪🇧🇷🇵🇹

Super useful thanks!