Important browser based web development tools:
This tools is used to measure the dimensions of web elements.Draw a ruler to any web page and view width, height and placements position (top, bottom, left and right).
Colorzilla or colorpicker tool is used to pick a color and generate gradient effects. After picking a part in web page, It will give the hex decimal and rgb color code as a result.
Fontface Ninja Tool
It allows user to identify the fonts used in a web page. It will show the font family name, font size and line-height of text contents.
It allows user to take the screenshots of viewing web pages.It allows you to take screenshots and the edit, organize and export.
This is an open source tool and it offers suggestions for improving the page’s performance. This is available in both chrome and firefox add-on list.