As you start developing and coding your own web pages, you will perform some tasks repeatedly. The following resources will help make your life a little easier. Some resources are software to download and install, whereas others are extensions you can add to your browser:
Instant Eyedropper: Find the color in a wireframe, or match the color in a logo with this color picker tool, which lets you find the color of anything displayed on your screen.
Ruler: Measure the pixel size of buttons, images, and layouts.
F.lux: Staring at your monitor for hours can strain your eyes. Ease your eye strain by automatically adjusting your monitor to the time of day, warm at night and like sunlight during the day.
Awesome Screenshot: Screenshot your website to show others or screenshot other sites for inspiration.
Social good ipsum: Lorem ipsum is Latin words used by developers as placeholder text when prototyping webpages. This version uses copy usually found on NGO websites.
User agent switcher: View your website as if you were using Chrome, Firefox, iPhone, Android, or even a Windows Phone.
IE Tab: View webpages using the Internet Explorer rendering engine. IE can display webpages differently than other browser, and this allows you to see your website in one tab and how IE renders it in another tab.
Dribbble: See creative designs shared by designers and other developers to act as inspiration for your own websites.
Resolution test: Your website visitors all use different resolutions, which you can test using this app.
Userium: Review common usability problems before launching your website.