Nothing can be more useful than handy tools you can use “on the fly” in your design process. Whether you’d like diagramming application, create vector images, format or optimize CSS code, generate patterns- you can use dozens of tools to make your life easier.

Today, we are listing 15+ Free And Helpful Web Based Tools That Every Designer May Want To Know! We tried to make this list most useful and interesting for every designer. Most of them are not very well known, but they are really amazing in respect to their features. Just take a look at them and share your thought’s here.

1. Vector Magic

Convert bitmap images to vector images with a few simple clicks. Just upload your image and Vector Magic will vectorize it for you.

2. FontStruct

Is a free font-building tool that lets you quickly and easily create fonts constructed out of geometrical shapes, which are arranged in a grid pattern, like tiles or bricks.

3. Kuler

kuler is an online web-based application by Adobe that helps you create and share color themes by several options such as “Analogous, Monochromatic, Triad, Complementary, Compound, Shades or Custom”. Users can also collaborate, comment and share color themes based on predefined color formulas or you can create custom themes by using Kuler’s interactive color wheel.

4. CSS Layout Generator

This generator will create a fluid or fixed width floated column layout, with up to 3 columns and with header and footer. Values can be specified in either pixels, ems or percentages.

5. ThinkFree

Enjoy instant access to your files, and share them with colleagues and friends anytime, anywhere. Documents editing is fundamental.

6. Remember The Milk

An intuitive interface makes managing tasks fun. Set due dates easily with next Friday or in 2 weeks. Extensive keyboard shortcuts make task management quicker than ever. Receive reminders via email, SMS, and instant messengers. Adding tasks is as simple as firing off an email (even from your phone) and much more

7. Favicon generator & editor

This tool provides an easy way to convert any GIF, PNG or JPEG to ICO which is supported by all modern web browsers. It also enables you to create favicons from scratch via a handy online editor. Additionally the editor lets you manually tweak generated favicons to ensure the best possible result.

8. EmChart

Using a relative unit such as EM is a great way to maintain the vertical rhythm of a web page when a user resizes text in their browser. Constantly reaching for a calculator to compute the correct EM value to use every time you need to is also a great way to drive yourself mad. EmChart is very useful for calculating bottom margins, line-heights (which are unitless, but the formula still applies), top margins, and top/bottom padding among other things. It’s also really handy for keeping nested relative font-sizes straight. Built on this formula for computing the EM multiplier is: desired pixel size / current pixel size = multiplier

9. Web Development Project Estimator

The Web Development Project Estimator is a simple tool that allows web designers and site developers to quickly and thoroughly estimate the time and materials required for a proposed web project.

10. Color Scheme Designer

Color Scheme Designer is an online application helps you create color schemes of different types and it may facilitate your looking for the optimal color palette by controlling the saturation and contrast level for the chosen color schemes.

11. 42 Must-Bookmark Resources for Web Designers - Inspiration, Design, Color, Fonts and More

12.Web Design Toolbox: 130+ New Tools to Make You a Better and Faster Designer

13. Web 2.0 button generators for beginners 

14. Web Design Principles 

15. Essential Web Developer Tools (Validation, Browsers, Transparent PNG’s And More)