Meet LESS, The Dynamic Stylesheet Language

Writing CSS is usually pretty straightforward – the syntax is simple and all you have to do is pick an HTML element, select a property and assign a value to it. However when coding CSS for complex designs, you will often see yourself writing a lot of repetitive rulesets or re-defining the same style for your markups. Obviously you could use the shorthand properties of CSS to save you some of the mundane coding, but to truly speed up your CSS development you probably need support of variables, nested rules or even functions.

If you want to stick to being DRY (don’t repeat yourself) for writing less code, then enter LESS. LESS is a JavaScript based CSS preprocessor which allows you to write CSS in its extended syntax and it will automatically compile that code into normal CSS. Currently LESS supports variables, mixins, operations and nested rules.  Variables will allow you to define widely used values in a single place and then re-use them throughout the style sheet:

Each of these different dynamic behaviors are real time-savers and the best way to understand how they work is to refer to the site’s usage examples.