Fresh Resources for Web Designers and Developers (July 2014)

It’s a new month and that means that it’s time to share some handy resources for designers and developers. For this round, we have put together a more varied list of tools worth looking at. Whether you want to brush up on your CSS terminology, wish to play with more blended gradients or are looking for a convenient way to interact with the community of coders and developers, we have a range of things for you to choose from.

CSS Vocabulary

Have you ever wondered what is meant by CSS rules? or which one is called a Class selector? All these CSS specialized terms can be confusing at first. Some people also use them interchangeably, even though they are completely different things. CSS Vocabulary can help you out by listing all of the terms used in CSS and describing them in an interactive way.

css vocabulary
CSS Shrink

CSS Shrink is a Node module that merges duplicate style rules into a single line of style rule. This module allows you to keep your stylesheets DRY (Don’t Repeat Yourself) and also decreases the stylesheet weight, which helps increase the loading speed of the website.

css shrink

I was recently looking for an application to manage my password that is compatible and works across my MacBook, iPhone, and Windows Phone – then, I came across Enpass. Enpass is a cross-platform application to store passwords as well as your other credentials. Enpass is available for OS X, iOS, Windows, Windows Phone, and Android.

Choose a License

Are you confused about which license to use for your products? The problem with a license is that it is usually written in a very long sentence that causes you an instant headache from just looking at it. Choose A License, as its name implies, summarizes popular licenses – MIT, Apache, and GPL – in a more understandable way, letting you decide quickly which license type is the right one for your code(s).

choose a license

Github has finally launched the icons that flavored its website in Octicons. You can now embed it into your website and application through the CSS3 Font Face. At the time of the writing, there are 177 icons added into Octicons. And since the OCticons project is open for contribution, the icon number will likely keep increasing in the future.

Side Comments

SideComment.js is a JavaScript library that adds the ability of side comments, which is similar to what is found on It adds a plus sign at the side of each paragraph and enables the readers to comment on the individual paragraph. It’s a good alternative to a traditional commenting system.

side comments

CoderWall is a bit like a social media site for coders and developers. In CoderWall, you can share tips, and tutorials, and learn from other developers’ experiences. You waste less time and you’re on your way to being more productive.


Headstart is a responsive front-end boilerplate that is designed as a starting point and the foundation of any web application. Headstart ships with a set of supporting development tools such as Gulp, Sass, and Handlebars. These tools have already been set up, so you can focus more on building your web application rather than wasting time on the configuration.