As a freelancer who has to create attention-grabbing images for clients, I am always on the lookout for the best Google Chrome extensions for design that will make my work 100 times easier.
Whether you’re a veteran designer or just starting out, by the time you’re done with this post, you’ll have at least one new tool that will help you create even better art (and be more efficient too).
Screenshot and annotation Chrome extensions
—
1. Awesome Screenshot
Awesome Screenshot is super helpful when it comes to taking screenshots and screen recordings of your screen while online.
Features
- Screenshot online pages while browsing
- Create a video recording of your screen
- Crop and resize screenshot images
- Annotation and blurring tools also available
- Easily download and save your images and videos
2. qSnap
qSnap is a cross-browser screen capture tool for Chrome, Firefox, Safari, Opera and Internet Explorer.
Features
- Capture and annotate multiple images at the same time
- Consolidate multiple images into one document
- Share screen captures across platforms
3. Evernote Web Clipper
Evernote is a popular note-taking software for both mobile devices and desktop/laptop computers.
Features
- Capture screenshots while online
- Organize screenshots in folders
- Sync screenshots across devices so you can access them anywhere
Image and photo editing Chrome extensions
—
4. Colorzilla
Discovered a pretty color on someone else’s website? Find out its HEX code by using Colorzilla.
Features
- Get a color reading from any point in the browser
- Displays both RGB and HEX codes
- Easily paste colors into any other application
5. ProofMe for Canva
With Canva’s ProofMe extension, you can create proofs of your Canva designs and email them to friends or colleagues.
Features
- Share proofs seamlessly with Gmail, Facebook, Twitter, Slack and more
- Annotate designs by drawing lines, highlighting text, taking measurements and adding comments
- Easily incorporate feedback and save new versions of proofs
6. Picmonkey
Picmonkey is one of the best Chrome extensions for designers that allows you to instantly edit screenshots and images found on any webpage.
How to use PicMonkey
- Click the PicMonkey icon when you’re viewing a web page.
- Select any image or screenshot in a sidebar.
- Perform basic edits like: crop & rotate, image filters, overlays, fonts, textures, frames and touch up tools.
7. Slidely Photo Remix
Bring any online image to life with the custom editing features of Slidely Photo Remix.
Features
- Add text overlays to any image with one click.
- Create full blown collages, slides with music or even a promo for your business.
- Share your photos via email, Facebook, Google Plus, Pinterest or Twitter.
8. Photomania
Instantly turn any online photo into exciting visual art with easy-to-use effects from PhotoMania.
How to use PhotoMania
- Hover over any image in your browser.
- Choose from over 400 effects. In this example, the “Sketch” effect was selected.
- Share your image with friends.
If you like PhotoMania, Polarr and GooEdit are two other extensions that allow you to easily edit photographs right in your browser.
9. Sumo Paint
Sumo Paint is a full-featured painting and image editing extension for the advanced designer who would like to create stunning images without the price tag that comes with tools like Photoshop.
Features
- An active art community of over 570,000 members and over 2 million images
- Support for image layers
- Shadow, glow, gradient and overlay effects
- Image adjustment tools for curves, levels, color balance and more
- Professional painting tools with over 300 brushes
- Dozens more features comparable to Photoshop’s standard tools
10. Your Graphic Designer
Your Graphic Designer is an HTML5 vector graphics editor can be used to create drawings, vectors and paintings both online and offline.
Features
- Free-hand drawing
- A full slate of vector tools including lines, shapes and curves
- Export as SVG, PNG, JPG, BMP and PDF formats
- Multi-language support
11. WhatFont
Cool web font caught your eye and need to know what it is? WhatFont inspects and detects the fonts used on any website.
How to use WhatFont
- Click on the WhatFont icon to see a list of the different fonts used on the page.
- Hover over a specific portion of text to learn about its font type.
12. Image Downloader
Browse and download all of the images from any website with Image Downloader.
- See all page images, both hosted or linked
- Filter images by width, height and URL
- Download or open individual images
Use the Gallerify extension that performs the same function.
13. Pablo
Design images that are optimized for every social media platform using the Pablo Chrome extension.
How to use Pablo
- Choose from over 600,000 free stock images or upload your own.
- Select which social media platform will be hosting the image.
- Add text and other image filters to create your very own masterpiece.
14. Emoji Keyboard
Love Emojis? Add them to your written content or on images with this extension.
How to use Emoji Keyboard
- Click on the Emoji Keyboard icon in your browser bar.
- Search for the emoji you want to use.
- Click to copy, then paste it into whatever you’re typing.
15. HoverZoom+
Zoom in on any website image by simply hovering your mouse over the image.
Features
- Works with Amazon, Facebook, Flickr, Google (Google Images, Google+), Imgur, Pinterest, Reddit, Twitter. Tumblr, Wikipedia, WordPress, YouTube, and more
16. Texmage
Create text overlays on any image using Texmage without the hassle of first downloading the image, uploading it to Canva or Picmonkey and then editing it.
How to use Texmage
- Select an image from any website.
- Add text on the image and adjust its size, font, color and opacity.
- Download your new “texmage” or share it on social media.
17. Save To Google Photos
Save images you find online to your Google Photos so you can work on them later.
Features
- Unlimited, free storage
- Access photos anywhere you have an internet connection
- Automatically remove duplicate pictures
- Multiple photo albums
Web developer Chrome extensions
–
18. PerfectPixel
PerfectPixel allows developers to put a semi-transparent image overlay over the top of an HTML page to perform pixel-by-pixel comparison between them.
Features
- Support for multiple overlays
- Inversion and scaling support
- Overlays saved between browsing sessions
Two other overlay tools—Bootstrap Overlay and Instant Wireframe—are worth checking out as well.
19. CSS Shack
CSS Shack is a Chrome extension and desktop application that allows you to create website designs and app mock-ups easily.
Features
- Create layer styles
- Export styles to CSS and store
- Use for creating and maintaining a web style guide
20. CSS3 Generator
The CSS3 Generator extension creates the CSS code you need so you don’t have to write it yourself.
Features
- Text and box shadows
- Hex/RGBA colors
- Transforms
- Columns
- Gradients
- Transitions
- And more!
21. Page Ruler
Page Ruler lets you draw a ruler on any page to display the pixel dimensions and positioning for any element on a web page.
Features
- View the width & height and top, bottom, left & right position
- Guides extending from the ruler edges
- Manually update the ruler size and position to make precision changes
- “Element Mode” outlines page elements on the page as you mouse-over them
- Navigate through parent, children and sibling elements of any element
22. Chrome Daltonize!
Color blindness affects around 5% of the population. That’s 1 out of every 20 computer users! The Chrome Daltonize extension amplifies color details so that color blind users don’t miss out on any content.
Features
- Simulates how images will appear to a color blind person
- Reveals colors to color-blind users allowing so they can see details
23. Window Resizer Beta
Every screen size has a different resolution, and Window Resizer shows you how a website will look on different screens—all in your browser window.
How to use Window Resizer
- Once installed, clicking on the extension icon will open up a dialog box (as shown in the image below) that allows you to resize your screen to different resolutions so you can simulate what a website would look like at that screen size and resolution.
24. Web Maker
Web Maker is perfect for developers who want to experiment with HTML, CSS or Javascript elements when you’re not online.
Features
- Save and load your creations, anytime, anywhere
- Code autocompletion
- Edit in CodePen
- Preview screenshot capture
- Open source on Github
25. Blue Button
Blue Button is a DIY designer’s ultimate spy weapon. Use it to inspect the meta description, tags, CSS and everything else “under the hood” of any website.
Features
- A run-down of all essential web design, graphic and SEO elements in one click
- Access SEO related information such as tags, meta description and header information
- View a list of all scripts and stylesheets used on the site
- See the site favicon, touch icons and other images.
- Find out which Google fonts are loaded
Inspirational Chrome extensions
—
26. Flickr Tab
Once Flickr Tab is installed, every new Chrome tab will display a popular photo from the Flickr community.
Features
- Wide range of high-quality images from the Flickr community
- One-click access to the image on Flickr
- Instant link to more photos from the user
27. Google Art Project
It’s not always easy to get inspired when you’re an artist. Google Art Project opens up a new artistic masterpiece every time to open up a new Chrome tab.
Features
- Masterpieces ranging from Van Gogh to Monet to contemporary street artists
- Artwork refreshed daily
- Each image is connected to more information on the Google Cultural Institute website
28. Wookmark
Wookmark allows you to collect visual bookmarks to keep you inspired and get those creative juices running.
How Wookmark works
- Easily bookmark and save images from other websites
- Upload your creative output and share it with others
- Use groups to build mood boards
- Share and discuss images with friends
29. Muzli 2
Get real-time design inspiration, including photographs, designs, UI/UX and more from around the web.
Features
- Replaces your Chrome default page with the freshest design, UI, UX and interactive news and photos from around the web
- Integrates with Dribbble, Designer News, Sidebar, CSS Winner, The Next Web, and more
And that’s a wrap!
—
That’s 29 Google Chrome extensions for designers to help you create stunning images and always be inspired!
What are the Chrome extensions for designers missing from our list? Let us know in the comments below!
—
About the author: Gertrude Nonterah is a scientist by day and a blogger/freelance writer by night. When she is not writing or finding things to write, she is watching the next interesting spy movie.
