Mohamed Atef
11 Mar 2021
General
Welcome to Web-Brackets.com, every developer and design should have helper tools in their browser to make their work more accurate & more professional, today I am going to provide you a package of important Google Chrome extensions all of them are super easy to use,
Let's find out! :)
WhatFont is one of the most important google chrome extensions which you should install to recognize the Font family, Font size, Font weight, Line height, Text color which elements are using all you need to start using this extension is adding it to your browser through this link from Chrome web store
How to use this Extention?
You need to just click on the Icon and your cursor will be like an indicator then you will put your mouse on the text or the element which you want to check like the image below
GoFullPage is an amazing Google Chrome extension will make you able to take a screenshot of the entire page in one click only this extension will be useful if you want to show your website to your client or you want to save an image of the website to add it into your CV, you can install this extension from here using Chrome web store
CROS Unblock is a necessary Google Chrome extension that you will need to have if you generate or use Ajax or Axios or Any frontend request on the browser while you are developing your Website when you active this Google Chrome extension your browser will skip the CROS error
If you active the extension and you will seeing the error you should know that this error is comming from the backend server or you will need to add ‘access-control-allow-origin’ into the header of the request
ColorZilla helps web developers & designer to recognize the color by switching the mouse Cursor to be like a magnifying glass with auto color recognizer it's one of the best ways to recognize the colors in any webpage you can install it from here
If you want an alternative you can use the developer tools by pressing on F12 & for Max by pressing on Command + Shift + I or Option + ⌘ + J then you can write a color property in CSS like the image below, then click on the color beside the HEX code , it will open a Color picker & then you can move your mouse through the page to copy the HEX code of any color you want
Page ruler redux helps you to Measures the spacing in the webpage easily especially in the complex layout because the simple layout you can use dev tools to know the margins & padding of each element but when you start using line-height with padding & margin and positions in CSS it's gonna be harder to use developer tools
No Comments to show
© 2024 Copyrights reserved for web-brackets.com