My tools

Designers and Developers allowed

We all have our favourite tools we use to make our websites fancier, prettier and more usable. Code clarity changes a mess into an interesting experience as a designer or developer. These tools make the workflow easier and lower the time of editing your work. This is my list of such websites. If you have any other suggestions tweet me, or send me a message on G+. Enjoy!


I chose to start with Dirtymarkup because it’s like the magic wand for code validation and formatting. It has been developed by @claviska. Its interface is pretty cute, with two themes (light and dark), indentation setting and spacing settings. But what it actually does? It formats HTML, CSS and JS code fragments or full-code with the quality of any other beautifier and it warns you about code errors or bugs. It literally rocks.

Markup Validator

This is actually Unicorn, the most complete validator from W3C: it checks both HTML and CSS and also the feed. As the HTML5 and the vendor properties aren’t really stable, this might raise you some errors and about 100 warnings. In most of the cases you should just swipe down, without trying to correct them. But you should read them anyway. It might prove an useful task.

CSS Minifier

This is the minifier I use for stylesheets. It doesn’t have so many options, but it does a really good job. Also, it serves the downloadable file.

This is THE most complete CSS minifier. It offers you lots of options (some not to mess with, like selectors sorting) and URL input for external files. The output can be a downloadable file as well.

JS Minifier

A bootstrap website that offers lots of plugins in many languages, made by Andrew Chilton. Even thought he offers quality instruments, I recommend only the JS minify. You should try it.

Can I Use…

This is an amazing website that tells you about the browser support of an incredible number of properties. It’s a must.

Text Compare

You’ll sometimes need a way of comparing two texts character by character. This is the place.

Icomoon helps you to build your own icon font from editable SVGs, and from another dozen packs. Tons of features that will please any one of you.

Color Hex

Sometimes you need help building a color palette or just to find out the rgb() of a hex code. Here your needs are satisfied.

Online Convert

Maybe the best format converter, this website turns almost anything into everything. You’ll might wanna check this out.

Android device art

The device art generator enables you to quickly wrap app screenshots in device artwork. When you market your UI’s this will be handy.

Real Favicon Generator

This provides the complete package of favicons you will need for any website. It covers almost any browser or operating system.

Windows Tiles

Even if the tiles are already made by The Favicon Generator, the windows 8 tiles should be handled by their own soft.


Still in the favicon field, grabicon gets the icon of lots of sites using their own soft.


With their new interface, JsFiddle helps you test, save online, share and collaborate pieces of code.


CodePen is a playground for the front end web, as they describe themselves. They have the same functions as JsFidlle and more, like preprocessors for SCSS and LESS.


Plnkr adds further help for the front-end developers, having the functions of JsFiddle, but with a library of well-known stylesheets and scrips.


Cloud9 is the ultimate site for testing code in any about a hundred programming languages. With a shell and a Javascript console, it makes a new world of possibilities come to life.

Tiny PNG

Size matters. So you will need an image compressor. Tiny PNG does that.

Another image compressor, with more options like lossy or loseless compression.

Page Speed

Page Insights is a tester right from Google. It analyses the desktop and mobile interface and the user experience.

Pingdom Tools

The best speed tester, that can save you a public test, with multiple servers and lots of details.

Which Loads Faster

A soft which compares the loading speeds of two websites once, twice or any number of times, like in a race. It even works on local files, if you’re not working in the cloud.

Browser Shots

Once a day, Browser Shots can take screenshots of your website on various platforms. Testing is crucial.


Browser Stack covers everything that Browser Shots misses. It is reliable and famous.


This was a great selection a year ago. Now it seems a bit obsolete on some chapters. However, you should check what works for you. Happy Coding!

Originally published at on January 2016

Something on my homepage
One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.