Skip to main content
Sheelah Brennan

Chrome Extensions for Web Development

I have been thinking lately of how Chrome Extensions have really sped up my design and development process. What would the world be like without them? Yes, Firefox has its share of extension goodness, but today I’m going to focus on Chrome since I spend more time in Chromeland these days. Here are some of my favorites:

  • LiveReload: Love! This is a major timesaver, allowing you to see your HTML, CSS, and Javascript changes automatically upon file save. There was just something magical about it the first time I saw it demoed at a conference a couple years ago.

  • PrettyPrint: This translates any minified CSS or JS into readable code with syntax highlighting. It makes viewing source code of other web sites actually fun again… or at least possible!
  • ColorZilla: This extension acts like a Photoshop color dropper tool to let you easily determine what colors are used on any given web page. It has a color picker as well to play with colors but I prefer CS6 for that 🙂
  • Chrome Clear Cache: This lets you quickly clear your Chrome browser cache with the press of a button — great for the development process.
  • responsiView: This lets you test your sites when working on responsive design. There are preset browser sizes to test with or you can enter your own.
  • Responsive Inspector: I don’t use often enough, but it’s incredibly useful for quickly seeing what media queries are set up on a given site, or debugging media queries during development.
  • WhatFont: This lets you easily determine what fonts are used on a website without needing to view source. How useful is that?!
  • Chrome Sniffer: This lets you quickly determine what frameworks/CMS/ javascript libraries that a given web site is using, for those times when you’re curious but feeling lazy 🙂
  • Dribbble Benchwarmer: This isn’t a tool per-say, but I like using it as my Chrome “new tab” background on a regular basis to get some design inspiration from Dribbble, in a slick scrolling interface.

I’d love to hear about other peoples’ faves are as well!

Follow Me

Built with ♥ and Gatsby, hosted on Netlify

My new Skillshare course: Make Your Website Stand Out