For a bit of a change of pace, I thought I’d share some web-based design and productivity tools that I’ve found handy recently. The first three could be helpful to almost anybody, the final few are great if you are are doing design for the web. The best thing is that they’re all free — what are you waiting for?
ifttt
This is a brilliant concept that is so good, it’s one of those slap the forehead kind of things that makes you wonder why nobody thought of it before. In a nutshell ifttt is a web-based conditional task generator based on the “if this then that” model. In practice, this means that you can use one action (eg – new follower on Twitter) to trigger a second action (eg- send new follower a welcome message). In ifttt-speak, these scripts are called recipes, you can view almost two thousand of them here. There’s everything from getting an SMS message when there’s rain in the forecast, to automatically sending your Instagram photos to a folder in Dropbox. The possibilities are huge.
thenounproject
This is an interesting open-source collection of icons representing a huge number of nouns, all free and open source. Their mission: “sharing, celebrating and enhancing the world’s visual language.” The style of these icons is consistent and high quality. Potential applications for the icons are very wide-ranging, anything from powerpoint presentations to infographics to, well, you name it. For Environmental Graphic Designers, there is a special attraction, as DOT and NPS symbols are included in the collection. All the files are provided as clean B&W SVG files, which means they can be used directly for web work and scaled at will, or opened in illustrator as regular vector files for editing.
cl1p.net
This service, billed as the internet clipboard, is great for sharing clipboard items between two computers connected to the internet. You create a personal URL based on the cl1p.net URL, for example: http://www.cl1p.net/myclip, paste in your clipboard item, and it can be shared between computers whether they’re in the same office or in different countries. Great for collaboration, the same URL can be updated again and again. I would be cautious about using this for state secrets or credit card numbers, but for a lot of uses, this is much handier than e-mailing things back and forth. No sign-up required.
whatfont
Whatfont is a very simple way to view what fonts are being used on any website, along with the size specified, line height and colour. Whatfont functions as a bookmarklet, and is easily invoked and dismissed on the fly. It works really well and is the absolute fastest way to get this info.
csslint
An online CSS validator. Very simple to use, simply paste your CSS into the text box and get instant feedback about what’s wrong. A great reality check when you’re feeling cocky (it will basically always find something wrong with your CSS) but even better as a second set of eyes when your CSS just isn’t doing what you think it should.
CSS3 Generator
A nice simple site that takes some simple parameters you input and turns it into valid CSS, along with info on which browser versions will support that code. Most of the parameters relate to the box model — rounded corners, shadows, outlines, colors, etc. You get a visual preview of what your inputs will look like, and some CSS that you can copy and paste.
0to255
This is a very handy tool that helps you find gradient variations on any color for the web. Very useful for specifying hovers, gradients, etc. Colour specs are provided in web-friendly hex code.
Ultimate CSS Gradient Generator
A powerful gradient editor that provides clean CSS for the gradient you create using the controls on the site. There’s a great preview that shows exactly what you’ll get, including size. You can choose from presets or mix your own custom blend. Includes opacity support.
Do you have some other great online tools you’ve found useful? Don’t be a hoarder, share them with others in the comments below…
Follow me on Twitter (@intudes) for interesting links and occasional observations.
Subscribe to the RSS feed, and don’t miss another post.
