The Dopefly Tech Blog

<< The Dopefly Tech Blog Main page

Try the LESS converter, right now!

posted under category: CSS on August 25, 2011 at 3:00 am by MrNate

Foreword: I am giving a LESS CSS talk at the Adobe MAX 2011 ColdFusion Unconference. Blogging about LESS is just one of my stepping stones to presenting. If you want the really good stuff, you should come to my session!

Today I am making public a tool I created to work with LESS CSS. This is a simple converter that takes your LESS and makes it CSS. It will help you learn and work with the LESS CSS language by showing you how things get converted and displaying any errors as they come across. Here's a screenshot to give you an idea of what you're up against.

LESS CSS converter
You can type or paste some LESS code into the box on the left, then click the stupidly large center button to see the CSS that LESS generates in the right box. You can keep the CSS and use it for whatever, that's fine. I have been using it over the past couple weeks to test LESS code snippets - in this case, it's really more like a snippet compiler, a test driver or a debugger. I tried to make sure all the errors come across with as much detail as possible, but that doesn't mean that LESS always gives useful compile errors.

It's up on GitHub, so you can download, clone or fork it and make a million dollars, or you can run the LESS CSS JS Converter right here from dopefly.com.

The tool uses the Javascript LESS compiler, so there is no server connection, it's all in your browser. Try it out and see for yourself how fast and easy it is to write LESS CSS!

Post A Comment!
On Dec 25, 2012 at 2:58 PM Beben Koben (beben.koben at the ever popular gmail.com) said:
thanks :)

On Dec 27, 2012 at 11:51 AM Scott Rippey (kokanut82 who wouldn't be caught dead at hotmail.com) said:
It's very helpful being able to test LESS syntax this way.
I'm looking for a LESS CSS compiler that allows me to choose which version of LESS to use. They just introduced version 1.3.1, and I'd like to see a dropdown or something that lets me choose this new version, so that I can test for differences. Feel like adding that?

On Dec 27, 2012 at 1:05 PM Nathan Strutz (www.dopefly.com) said:
Yes, that sounds like a fine idea. Version drop-down, fix up the design I think, I have version two coming together in my head. Anything else you want to see?
Post A Comment!