9 Useful Chrome Extensions for Web Developers / Web Development
Tags: webdev, beginners, javascript, productivity
Published: 2023-02-21 02:23:21


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](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d5pqmzlia0jy7z3zlwh3.png)

---

## 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](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/iegtu752f943s4du9ijb.jpeg)

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](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](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9nqo3x37kjw2xhyqoat3.jpeg)

Link: [https://chrome.google.com/webstore/detail/adblock-%E2%80%94-best-ad-blocker/gighmmpiobklfepjocnamgkkbiglidom](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](https://coolors.co/) for future inspiration.


![ColorPick Eyedropper Screenshot](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fhm6vmx0ty2iui6vabzi.png)

Link: [https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg](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](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qn35l3u8owxe8ygxfir6.png)

Link:[https://chrome.google.com/webstore/detail/whatfont/jabopobgcpjmedljpbcaablpmlmfcogm](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](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jxzyuk8orfe65v6zjsy4.png)

Link: [https://chrome.google.com/webstore/detail/gofullpage-full-page-scre/fdpohaocaechififmbbbbbknoalclacl](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](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ubswka33xzhdkgwocjov.png)

Link: [https://chrome.google.com/webstore/detail/awesome-screenshot-and-sc/nlipoenfbbikpbjkfpfillcgkoblgpmj](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](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u7iyhqus2frohyg7vjaw.png)

Link: [https://chrome.google.com/webstore/detail/lorem-ipsum-generator/pglahbfamjiifnafcicdibiiabpakkkb](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](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wpm0k2afh8wus7tavy1c.png)

Link: [https://chrome.google.com/webstore/detail/image-downloader-imageye/agionbommeaifngbhincahgmoflcikhm](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](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ebevi4ncond2o8i0cg4j.png)

Link: [https://chrome.google.com/webstore/detail/json-viewer/gbmdgpbipfallnflgajpaliibnhdgobh](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 :)