← 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.

Image of Tucker Triggs

Found this useful? Get new posts sent straight to your email.