How to use Less CSS with PHP

Do you now Less - Leaner CSS?

It is the CSS future!

Less allows you to extend the CSS functionality. You can add variables, nested rules (wich I love) and lots more.

You can code faster and less than using normal CSS.

Less was created for being used in Ruby. Lucky us we can use it in any other web lenguage.

There is a JavaScript version of the Less and you can add it to your projects.

Check out some of his features...


@nice-blue: #5B83AD;
@light-blue: @nice-blue + #111;

#header { color: @light-blue; }


.rounded_corners (@radius: 5px) {
-moz-border-radius: @radius;
-webkit-border-radius: @radius;
border-radius: @radius;

#header {

#footer {

Nested rules

#header {
color: red;
a {
font-weight: bold;
text-decoration: none;


@the-border: 1px;
@base-color: #111;

#header {
color: @base-color * 3;
border-left: @the-border;
border-right: @the-border * 2;

#footer {
color: (@base-color + #111) * 1.5;

How to use it?

You will need to add the 2 lines below.

Create a style.less file in your project and start coding 😉

Leave a Reply

Add <code> Some Code </code> by using this tags.