Collection of Extensions for Designers on browsers

As a Designer, you certainly need tools to analyze images, colors, and find patterns. If doing it manually is quite time-consuming, you can ask for help Extension on the browser. In addition to browsing the web, the browser also supports a number of extensions to help you handle your requests faster. For example: find the name of the font being displayed, change the size of the browser window, get the color code… You can refer to the Extensions for Designers below:

MAI LAN IMAGE SEARCH – Extension to find and download stock photos online

Mai Lan Image Search is an Extension for Designers that helps quickly search and download images and stocks for FREE and in high quality from leading websites… This is an Extension written by Vietnamese people. With features like:

• Quickly search for free images and stock from many sites.
• Easily do a quick search by selecting keywords on the web and accessing the context menu.
• Download all images (supported sites: Everypixel, Burst, Unsplash, Pexels, Picjumbo).

Link on Chrome: Download Mai Lan Image Search

WHATFONT – Find the website's Font name

This is an extension that helps designers identify and reuse fonts. This is the easiest way to identify fonts on web pages. With this extension, you can check web fonts by simply hovering over the font you're looking for. It's the simplest. Extension supports Typekit and Google Font API.

Download link on Chrome: download whatfont

WINDOW REIZER – Adjust window size

WINDOW REIZER is an extension that helps Designers resize windows so they can review their designs more accurately. This extension resizes the browser's window to simulate different resolutions. It is especially useful for web designers and developers by helping them test their layouts on different browser resolutions.

Fully customizable resolution list (add/remove/re-adjust).

You can set the window width/height, window position, preset icon (phone, tablet, laptop, desktop) and even the option to apply size new for the entire window or just for the viewport. The extension also has customizable global keyboard shortcuts, an option to export your settings and import them on another computer, and more!

Download link on Chrome: download Windows Resizer

PAGE RULER – Displays the size ruler bar

Extension Page Ruler helps us measure the size of elements anywhere on the page. Displays a ruler that outputs the width, height, and location you need to measure. Main features:

• Draw rulers to any page and see width, height, and top, bottom, left, and right positions
• Drag the edges of the ruler to resize it
• Use the arrow keys to move and resize the ruler
• Show guides extending from the ruler edges
• Manually update the size and position of the ruler from the toolbar to change the precision
• Enable “element mode” to outline elements on the page as you move your mouse over them

Download link on Chrome: download Page Ruler

PERFECTPIXEL – calculates each pixel in detail

Extension PerfectPixel helps designers compare designs accurately down to each pixel.

PerfectPixel allows markup developers and designers to place semi-transparent image overlays on top of developed HTML and perform pixel-perfect comparisons between them.

Features and characteristics:

• Supports multiple overlays
• Supports reversion and replication
• Separate overlay for each site
• Overlays are saved between browsing sessions
• Minimalist easy-to-use user interface
• Supports drag-n-drop file upload
• Paste from url and clipboard support
• Arrow keys and mouse support

Download link on Chrome: download PerfectPixel

PICKMONKEY – Take and edit screenshots

This is a screen capture extension that edits screenshots. In addition, it also helps you download all web screenshots with one click. PicMonkey Chrome lets you instantly grab images from any website and open them in PicMonkey for editing. This is an Extension for Designers who often write notes or post articles on the web.

Download link on Chrome: download PicMonkey

SVG GRABBER – Download image and SVG code

SVG Grabber is an Extension for Designers that helps you download logos or images on a website in the fastest way. SVG Grabber allows you to preview, download and copy code all SVG icons and illustrations in a website.

Download link on Chrome: Download SVG Grabber

NINJA FONTFACE – Displays the Font name in the browser

With fontface ninja, just by dragging the mouse, you can know what font the website you are visiting uses?

Link on Chrome: Download ninja fontface

CUSTOM CURSOR – Change the mouse pointer

Too bored with the cursor style on Chrome, use the Custom Cursor extension to customize and design the mouse cursor to your liking. Create your own large collection of free mouse cursors.

To upload your own style mouse pointer, use:

• Small images (optimally 16×16, 32×32 pixels, no more than 128×128);
• Image on a transparent background, such as .png format.

Link on Chrome: Download Custom Cursor

SITE PATELLE – Get exact color codes

This extension can help you get individual colors as well as get the entire color copy of a web page. If you want to know what color the banner or text on the website is using, Site Palette will help you get that color code right away. This is an Extension for Designers that frontend developers should install on the browser.

Link on Chrome: Download Site Palette

According to Nguyen Hoang (J2team)