← Back to Blog

Chrome Extensions for Web Development


October 22, 2018  ⋄  Last updated Mar 9, 2020  ⋄  2 min read

Chrome’s extensions allows you to supercharge your web development process in the browser. Here are a few that have proven themselves useful and have become a regular part of my development workflow.

WhatFont — Identify web fonts on hover. Click to see additional details.

Wappalyzer — Detects the technology behind the websites you visit. Cool info such as web frameworks, content management systems, and server software.

VisBug — Open source web design tool. Great for designing, prototyping, modifying, or debugging visual and code problems.

Octotree — Github file tree navigation that makes it easy to move around projects quickly on Github’s website.

SnapFont — Preview Google fonts on a live website. This is great to assess typography options on the fly.

JavaScript and CSS Code Beautifier — This extension will automatically beautify and add syntax highlighting to CSS, JavaScript, or JSON files.

One Click Full Page Screenshot — Simple way to take full length screenshots of websites, annotate, and download them. Useful for collaborating on visual designs and displaying web work.

Color by Fardos — Pick colors from websites, save colors & gradients, get matching shades and tints and create beautiful gradients. An intuitive and useful color extension.

Emmet Re:view — Test responsivity across multiple devices side-by-side. See your website across all Apple or Android device sizes at once.

Form Filler — A time saver when building complex forms, the form filler extension supplies dummy data to all form fields so you don’t have to do it yourself.