20 Incredibly Useful Tools and Resources for Web Designers

When it comes to Web design, the tools you use play an integral part in your results. Of course, we’re big fans of getting down to the basics, likeputting pencil to paper, but sometimes finding new apps and resources can help you get those creative juices flowing.

Check out our list of 25 incredibly useful tools and resources for designers and developers below. Then, be sure to let us know your favorites (or if we missed your favorite) in the comments!

Niice essentially operates as a design search engine, pulling in results from Behance, Dribbble and Designspiration. If you’re in need of inspiration, head here and you wont be disappointed. Example: Try this search for black and white script lettering.

Pixel Dropr is a Photoshop plugin created by UI Parade which allows designers to create collections of icons, illustrations, photos, buttons and other elements that can be dragged and dropped to any PSD file.

If you’re a Hacker News reader, you already know how Designer News works. It’s like the developer and startup scene-focused service, but instead emphasizes discussions on design and emerging tools that make the design process easier.

This Web app is a simplistic as it sounds. It shows you the current size of your browser window, adjusting accordingly as you resize it. If, for example, you’re playing with media queries, this tool could come in handy.

One of our favorite color-picker tools. On load, the entire window fills with a single color. Move your mouse left and right to adjust the hue, move it up and down to adjust the lightness and scroll to change the saturation. You should also try 0 to 255 and Colllor.

While typography plays an extremely important role in Web design, many designers aren’t trained to understand the difference between similar typefaces like Helvetica and Arial. This resource will help you test your skills and get better at telling the two famous faces apart.

Just like the “What’s My Browser Size?” tool mentioned above, this is an extremely minimal site which simply helps you convert from HEX to RGB color codes. Of course you can do this with any number of applications and services, but this is such a beautifully simple option.

Believe it or not, Keynote is the tool of choice for the Google Ventures design team. From our in-depth look:

Design partner John Zeratsky, UX research partner Michael Margolis, Knapp and I took to creating the mockups for user testing. We were instructed to use Keynote, which (completely to my surprise) proved to be an extremely useful tool for building functional mockups.