There are many design extensions on the Chrome browser that help launch websites, redesign, layout and overall experience. In this article, let’s find out the web design extensions from the Google Chrome web store.
Tools will help find the right fonts, develop color palettes, discover and create inspirational images, customize graphics, measure elements and analyze pages.
Chrome extension for web design
1. Pixlr Editor Photo Browser is a browser photo editor to completely control your image quality, including layers and effects. It contains advanced features commonly found in graphic design applications on PCs, such as layers, lasso tools, brush controls, clones and filters.
Utility link: Pixlr Editor for Chrome
2. ColorZilla is a utility that allows you to read colors from any point in the browser. Adjust the color, and then paste it into another program, create CSS gradients, palette viewer with 7 built-in palettes, etc.
Utility link: ColorZilla for Chrome
3. Palette Creator Lets you create a color palette from any image for further use during creation. Just right click on the image and choose the option of Palette Creator.
Utility link: Palette Creator for Chrome
4. WhatFont là the easiest utility to identify fonts on web pages. It will quickly retrieve information about the font of the text you are hovering over. However, WhatFont does not detect fonts in the photos.
Utility link: WhatFont for Chrome
5. Font Changer allows users to change fonts on any web page from among 500 selections from Google Web Fonts. You can set a font for all webpages or special fonts for specific pages.
Utility link: Font Changer for Chrome
6. Evernote Web Clipper help you save interesting information and images on the web to your Evernote account. It will save any web page you want, highlight the most important content, annotate, take screenshots and have access to the content whenever and wherever you need it.
Utility link: Evernote Web Clipper for Chrome
7. Amino is a direct CSS editor for writing continuous user stylesheets. It allows saving and syncing custom styles to your Google account; access them from multiple computers; Customize page appearance and correct rendering errors.
Utility link: Amino for Chrome
8. Stylebot Lets you manipulate the appearance of webpages with custom CSS. You can select an element and choose the changes you want to make from the editor such as changing the font, colors, margins, visibility, etc.
Utility link: Stylebot for Chrome
9. EnjoyCSS is a free online CSS3 creator that allows you to quickly adjust your graphic style without coding. You can perform two- and three-dimensional transformations, complex transitions, linear and radial gradients, text shadows, etc.
Utility link: EnjoyCSS for Chrome
9. CSS Shapes Editor is an interactive editor to create and adjust CSS shape values for a selected element.
Utility link: CSS Shapes Editor for Chrome
10. Dimensions is a tool for measuring on-screen items, such as area boundaries, images, input fields, buttons, videos, text and icons. It can also measure mockups.
Utility link: Dimensions for Chrome
11. Eye Droppper is an extension to choose colors from your website, color picker or color history.
Utility link: Eye Droppper for Chrome
12. Minimalist Markdown Editor is a simple, handy Markdown editor. Just write Markdown text and check back as you type. In addition, the utility also supports one-click HTML conversion, continuous tabs, offline functions, etc.
Utility link: Minimalist Markdown Editor for Chrome
13. BuildWith Technology Profiler is a tool that lets you determine what technology your site is built with. Once on a website, click the BuildWith icon to see all the technologies used.
Utility link: BuildWith Technology Profiler
14. Search Stackoverflow is a forum with questions and answers on many coding topics. Community of users asking and answering questions, voting and editing content.
Utility link: Search Stackoverflow for Chrome
15. Project Naptha is a tool for marking, copying, editing and even translating text from any image on the web.
Utility link: Project Naptha for Chrome
16. Web Developer Checklist for web developers containing useful practical information along with support documentation.
Utility link: Web Developer Checklist for Chrome
17. CheckbotIt allows the crawling of hundreds of websites on search engine optimization, speed and security. It also has a free service pack that supports testing of 250 URLs of each website.
Utility link: Checkbot for Chrome
18. Web Developer Added support for a toolbar button with various web development tools. This is part of a web developer extension for Firefox.
Utility link: Web Developer for Chrome
19. StayFocusd Set a time limit for specific sites. When the time is up, you will not be able to access the sites you have blocked for the rest of the day.
Utility link: StayFocusd for Chrome