Sep 3, 2021

15 Great Chrome Extensions for Web Designers and Developers

15 Great Chrome Extensions for Web Designers and Developers

Browsers are increasingly incorporating more extensions, plugins and add-ons, which are often developed by their users, making the browser more powerful, and helping us increase our productivity. Here at Awwwards, our mission is to share with you the best resources and tools on the web, so we're writing a series of blog articles on the best extensions and plugins for major browsers. To kick-off, we're focusing on extensions that are offered in the Chrome Web Store, available for free and easy to install.

Among the tools, we'll highlight those that are most useful for web designers and developers. We hope you find them useful and get you better results.

Don’t forget to visit our collection Handy Tools and Apps for Designers on a regular basis, where you can find new apps with great ideas to help your creative process.

Best Google Chrome Extensions for Web Designers and Developers

  • SVG Grabber
    SVG Grabber by Handy Tools and Apps for Designers

    Svg-Grabber is an open-source tool to quickly copy or download all the SVG assets from a website. How many times have you seen an interesting logo or icon on a website, and you craved to have it? Now, the SVG Grabber tool allows you to do that just with a single button click.

  • WhatFont
    WhatFont by Handy Tools and Apps for Designers

    A very popular and useful Chrome extension for developers and designers. If you are thinking about what font is used on a website, then WhatFont will identify the typeface for you. Just hover over it and find out instantly which font it is.

  • CSS SCAN
    CSS SCAN by Handy Tools and Apps for Designers

    With CSS Scan, you can check, copy and edit the CSS styles of any element in the HTML DOM. Say goodbye to "Inspect Element", just hover over the elements and copy the styles and CSS rules with a single click.

  • Window Resizer
    Window Resizer by Handy Tools and Apps for Designers

    In order to make your website more responsive, this extension resizes your browser window. You can choose from a list of popular screen dimensions ( desktop, mobile, laptop) or easily add your own custom sizes and resolutions.

  • Site Palette - Chrome extension
    Site Palette - Chrome extension by Handy Tools and Apps for Designers

    We all saw examples of websites with great use of color! Site Palette is a Chrome extension which extracts the main colours of the current website. With this tool, you can generate and share your favorite color palettes. Also, you can download a Sketch template or use Adobe Swatch support! 

  • CSS Peeper
    CSS Peeper by Handy Tools and Apps for Designers

    CSS Peeper is a CSS viewer tailored for designers. Inspect elements instantly with handy properties to use in Sketch or Photoshop, and get the whole color palette of the web listed in a visually appealing way. Start Inspecting styles in a simple, well-organized & beautiful way with CSS Peeper.

  • Hoverify
    Hoverify by Handy Tools and Apps for Designers

    Hoverify is a browser extension that enhances your web development experience by providing tools to speed up your workflow, such as CSS and HTML inspectors, CSS live edition, export to Codepen, inspecting media queries, finding fonts, extracting colors, toggling element visibility, and so on. Price $30