AddictedToWebThere are quite literally hundreds of Chrome extensions available for web designers. Here are 20 of the best.
Here is a list of Chrome extensions for design from Google’s Chrome Web Store. There are design tools to find the right font, develop your palette of colors, discover and create inspirational images, customize graphics, measure elements, and analyze your page as well as the pages of your competitors.
Chrome Extensions for Design
Pixlr Editor. Pixlr Editor is an online photo editor. No download is required, and it’s entirely free. It contains advanced features normally found in desktop graphic design applications, such as layers, lasso tool, brush controls, cloning, and filters.
PicMonkey. The PicMonkey Chrome Extension lets you instantly grab images from any web page and open it in PicMonkey, a free online photo editor.
ColorZilla. With ColorZilla you can get a color reading from any point in your browser, quickly adjust this color, and then paste it into another program.
WhatFont. WhatFont is the easiest way to get font information about the text you are hovering on. Also, WhatFont detects services used for serving web fonts. It supports Typekit and Google Font API.
Evernote Web Clipper. Use this Evernote extension to save web elements into your Evernote account. Add and highlight text, use visual callouts, share clips, and more.
Yslow. YSlow analyzes web pages and suggests ways to improve their performance based on a set of rules for high performance pages. YSlow grades a web page, summarizes a page’s components, and displays statistics about the page.
Benchwarmer. Benchwarmer is a Chrome extension for Dribbble, a site for designers to show and promote design work. Every time you open a new tab, Benchwarmer shows the latest inspirational images, from your feed or popular images.
Palette. Do you want to create a color palette that matches an image? Or grab some colors for inspiration? With Palette, just right-click on the desired image, select the “Palette for Chrome” option, and choose the number of colors you want the palette to have.
Instant Wireframe. This extension allows you to view any web page with a wireframe overlay.
Dimensions. Dimensions is a design tool to measure screen dimensions. Measure area boundaries, images, and HTML elements, buttons, videos, text, and icons. Ideal for measuring mockups.
Stylebot. Stylebot lets you manipulate the appearance of any website with custom CSS. Pick an element and choose any changes you want to make from the editor. Change the font, color, margins, visibility and a lot more. You can also write CSS manually.
Appspector. This extension will help to inspect the web framework, content management system, and JavaScript library running on a current browsing website. This extension can detect more than 100 popular CMS and JavaScript libraries.
CSS Shapes Editor. This is an interactive editor for CSS shapes. Create and adjust CSS shape values with an interactive editor overlapping a selected element.
Eye Dropper. Eye Dropper is extension for Google Chrome and Chromium. It allows you to pick color from any webpage or from advanced color picker.
Font Playground. Preview your site with over 1,000 Google web fonts, and then get the CSS code.
Minimalist Markdown Editor. Here is a simple and slick Markdown editor. Just write Markdown and see what it looks like as you type. The Minimalist Markdown Editor comes with a one-click HTML conversion tool and more.
Type Sample. Type Sample is a tool for identifying and sampling web fonts.
EnjoyCSS. EnjoyCSS is a free online CSS3 generator. Adjust rich graphical styles quickly, without coding. Make 2D and 3D transforms, complex transitions, linear and radial gradients, text shadows, and more. Access a gallery of CSS solutions.
Alexa Traffic Rank. Alexa Traffic Rank is Alexa Internet’s free extension for Chrome, providing Alexa data about the sites you visit. Learn how a site is being found through search, or see what it looked like in the past using the Wayback Machine.
Web Developer. This is the official port of the web developer extension for Firefox. Add a toolbar button to the browser with various web developer tools.