Browse By

14 Awesome Tools and Resources for Web Desingers

Designing and coding a website is a difficult task in and of itself, doing so without utilizing frameworks, snippets and the vast library of accompanying facilitative tools makes it near impossible for a novice.

1. Subtle Patterns

An amazing resource for high quality textured patterns. A lot of great artists have contributed there to create a collection of really sharp and versatile images. Oh, and browsing on their site is quite enjoyable as well.

subtlepatterns

2. Blokk Font

Blokk is a font specifically made for mock-ups and demos and is an excellent looking alternative to Lorem Ipsum. It could come in handy in the case of an edge of the art design that wouldn’t usually mix well with latin on it.

blokk

3. FreePik

Freepik offers a colossal collection of vector art, illustrations, SVGs, PSDs and stock photos. Everything is free and categorized neatly so you shouldn’t have any problem finding what you need, although you might have a hard time choosing, since there are over 1,4 Million items to date.

rsz_5freepik

4. Awesome Images

This one is a priceless collection of stock photo material. It features over 20 resources – all of them free and with their licences politely explained.

rsz_image_list

5. Google Fonts

You probably know about this one by now but we couldn’t omit it anyway. It’s Google’s font library which is by far the best place to go to when in the search of web-friendly fonts.

freeRes_google2-e1410189644103

6. By People

ByPeople.com is a content network of useful, constantly updated resources. By People gathers a big deal of beautiful, clean and up to date graphic freebies, Code Snippets and Useful Resources, organizing them into lists which can even be bulk downloaded from the site directly.

bypeople-e1410189620518

7. Snipplr

Snippler offers its users the ability to upload pieces of useful code and share it with the rest of the us. There are thousands of snippets in javascript, php, css, ruby and other languages. As an alternative, you might want to checkout CSS-tricks’s snippets, or github’s gists.

snippet

8. HailPixel

A fun to use color picker. It handles choosing the hue, lightness and saturation of colors in a unique and cool way.

colorpicker

9. Lokes HD Hakar

An awesome online service with a brilliant idea behind it. Color Thief lets you upload an image and get the color palette for it, as well as its dominating color. Very helpful for making design decisions.

palette

10. Dribbble

Dribbble is a community of web designers, graphic designers, illustrators, icon artists, typographers, logo designers, and other creative types share small screenshots (shots) that show their work, process, and current projects. A great place to explore new design ideas.

rsz_dribble

11. Bootstrap

A front-end framework for building responsive websites. It makes your websites responsive and look good both on small and on huge screens with a well done grid system and tons of CSS and JS features. There are lots of additional resources and plugins for bootstrap, as well as alternative frameworks like foundation.

rsz_5ab08d737caa88149e3a3598b20938f6-e1410194771179

12. Patternizer

This app makes creating stripe patterns easy as child’s play. Patterns can be saved and shared with anyone, allowing for collaboration and remixing.

rsz_1patternizer

13. Project Parfait

Project Perfait is an Adobe product that gives us the opportunity to get important info about a PSD right in your browser. However, it doesn’t support PSD editng (at least yet).

adobe

Coding

14. Emmet

Emmet is a plugin for many popular text editors which greatly improves the speed with which you write HTML by allowing you to transform CSS-like selectors into full-blown HTML very fast.

emmet

15. JavaScript Beautifier

On jsbeautifier.org you can find a tool that beautifies any scrambled or minified piece of JavaScript or HTML code. Another tool that you might find interesting, is this visual JSON editor.

beautify

Leave a Reply

Your email address will not be published. Required fields are marked *