Grow your CSS skills. Land your dream job.

New Poll: Your Preferred CSS Preprocessor Syntax

Published by Chris Coyier

There is a new poll up in the sidebar of the site which asks:

What is your preferred CSS preprocessor syntax?

The popular ones are in there, an "other" option in case you use something else (please share in comments), as well as answers for "never tried," "don't like any of 'em," and "no preference."

I realize that not everyone has tried all of them so the end results may be skewed toward general popularity rather than a honest syntax comparison, but that's OK it will still be interesting.

Comments

  1. cnwtx
    Permalink to comment#

    PHP. Yeah, it actually works great!

  2. Cannot, cannot believe that 45% of your respondents have not tried any preprocessor.

    Wut?

    These people are supposedly up on CSS, so, again, wut?

    People. Compass & Sass will change your life. Seriously.

    • Greg
      Permalink to comment#

      Yeah, I’m really down for SASS & Compass, but most people into just CSS are coming from a design/web design background. SASS & Compass are more on the grounds of development.

    • Keith
      Permalink to comment#

      I would say the fact that you stated “Compass & Sass will change your life” is precisely the reason many have not tried preprocessors. You can’t just up and “try” preprocessor to really get the feel for it. It has to truly become part of your project(s), part of your development workflow. That’s a big, as you say, life change. Especially when working on a team.

    • Michael Shepanski
      Permalink to comment#

      I love the idea of better CSS syntax, but my problem is I’m too ingrained to using Chrome or FF inspect to see where a CSS definition comes from, then going there to edit it. Using a pre-processor just ruins everything. :-/

    • Geoff
      Permalink to comment#

      No it doesn’t, sass and scss still use the same CSS properties but allows for variables and mathematic equations to be used as well, it shouldn’t negatively affect anything you do at all

    • Mr.Pakapun
      Permalink to comment#

      hello

    • Thomas
      Permalink to comment#

      I can’t speak for Michael, but CSS preprocessors would definitely affect my workflow, which typically involves writing and editing styles in Firebug’s “edit” view and copying/pasting all the rules into the final CSS file. This gives me the ability to create and edit with immediate feedback and avoid having to rewrite rules in another file or constantly save and refresh.

      If I were using a preprocessor, I would be overwriting all the variables and other processor-specific code.

    • When working on a team with inherited code, inertia has a tendency to win out over newer technologies (e.x. LESS came out in 2009, plenty of the websites that I work on are older than that).

      Starting over (or at least rewriting to take advantage of a preprocessor) isn’t an option in most cases.

    • Permalink to comment#

      @Thomas. This would be easily achieved with LiveReload. Trust me, until you try Less or Sass/Compass you don’t know what you’re missing. It’s one of those things that until you use it you don’t realize how much time you save.

      I use Sublime Text 2 which has support for Less/Sass syntax which again makes things even easier. Take a weekend and just play with it. You might be amazed.

  3. I’ve been studying both LESS and SASS syntaxes, but really haven’t bothered to try and use either in a project or even just for fun. I just have a hard time figuring out what would be more appealing to me. Both systems seem very similar to one another, and I see benefits and drawbacks to each, so it’s hard to choose. I’d be interested in hearing people’s reasoning for deciding on one over another.

    • I chose LESS over SASS, because the LESS documentation is more designer – friendly and it’s possible to try it just by linking to a JavaScript. Once I got hooked, I installed an app to compile the files.

      I like the LESS syntax better, that was also one of the reasons behind my decision.

    • I’m guessing you’ve tried out the .sass version of Sass and not the updated .scss… I’ve recently been reading up on scss a bit and it is quite life changing as someone else stated above, but is more visually pleasing and designer friendly then the original .sass syntax.

      Some of my favorite things about Sass is the ability to create grid systems based in CSS instead of have class=grid_3,vendor prefix fix with compass, the image sprite tool in compass, as well as the image sprite tool in compass (i know i said it twice)… and using percentage(960/320) for percentages in responsive sites!

      I’m still scratching the surface of Sass, so I’m sure theres much more to be excited about, but this has got me pretty excited already!

  4. Permalink to comment#

    Using Less, but I don’t have tried SASS yet actually

  5. Permalink to comment#

    SASS cleaner code. More fun to write.

  6. Carlos
    Permalink to comment#

    LESS ftw!

  7. Permalink to comment#

    .sass is definitely the way to go for us. We predominately use SASS when working on major projects. The only exception is for my WordPress projects, but they usually get mocked up in Webby initially anyway, which also uses SASS.

  8. thursday0384
    Permalink to comment#

    real men don’t need preprocessors.

  9. I haven’t used any of them, but less + stylus looked better to me when I researched it.

  10. dondondon
    Permalink to comment#

    I don’t know why people like LESS. Implementing it in a client-side environment involves loading JavaScript, which can fail. Why hope JavaScript will work when you should just serve normal CSS from the get-go. Compass and scss SASS works for me.

    • That’s a misconception. LESS *can* work that way, but it’s a *super bad* idea. LESS can “pre process” just like the others and you deploy just CSS.

    • Permalink to comment#

      @dondondon: LESS can be preprocessed server-side using PHP: http://leafo.net/lessphp/

    • Permalink to comment#

      I use LESS + LessPHP to do server-side pre-processing. Works like a charm, with the added benefit of always having the correct .less file available online. That’s what used to bug me the most about Flash projects: having to hunt down .fla files.

      Side note: I do think there’s a big cultural difference between the ‘designer mindset’ and the ‘developer mindset’. For devs, SASS+Compass comes naturally, whereas to (traditional) designers it’s positively scary. Same goes for things like source/version control, code libraries, etc.

    • dondondon
      Permalink to comment#

      I stand (ridiculously) corrected. I will take a gander at LessPHP and re-evaluate.

    • Permalink to comment#

      I use the Less Javascript preprocessor during web development, but when launching to a live site, I only publish the ‘compiled’ CSS file

    • Philip Allen
      Permalink to comment#

      LESS can be compiled using PHP, but I would recommend against this. Even though PHP will serve up a nice minified CSS file, the overhead of processing strings this large and gathering files together creates more overhead than you might think. Remember that load time is not just file size, you have to make a request to the server, and then the server has to do work to get something back to you. Your job is to reduce the amount of work the server has to do.

      It is better to do this work on your computer ahead of time and just save a nice, ready-to-go CSS file.

  11. James
    Permalink to comment#

    Sass+Compass is an amazing combination for work. I can’t imagine writing plain CSS ever again. Lately looking into Less simply because of Less PHP. Having the ability to compile CSS on the fly means my styles (pulled from SQL) can be easily modified for multile clients. Eventually I will just have an interface so clients can pick colors, which I’ll use less (lighten, darken, etc) to create site palettes on the fly. Endless possibilities!

  12. I prefer SASS over LESS because it can pre-process @import statements and generate a single CSS file as a result (LESS simply leverages CSS’s native @import behavior).

    • I’m fairly sure if you @import "whatever.less"; it can preprocess them together, just not .css files.

    • Gabe
      Permalink to comment#

      Yeah, but you can literally just change the file extension from .css to .less and import any stylesheet you want, right? Doesn’t have to have any LESS code in it at all.

    • brendan saunders
      Permalink to comment#

      @import works to import .less files. In fact, it’s how Twitter’s Bootstrap works.

      
      /*!
       * Bootstrap v2.0.1
       *
       * Copyright 2012 Twitter, Inc
       * Licensed under the Apache License v2.0
       * http://www.apache.org/licenses/LICENSE-2.0
       *
       * Designed and built with all the love in the world @twitter by @mdo and @fat.
       */
      
      // CSS Reset
      @import "reset.less";
      
      // Core variables and mixins
      @import "variables.less"; // Modify this for custom colors, font-sizes, etc
      @import "mixins.less";
      
      // Grid system and page structure
      @import "scaffolding.less";
      @import "grid.less";
      @import "layouts.less";
      
      // Base CSS
      @import "type.less";
      @import "code.less";
      @import "forms.less";
      @import "tables.less";
      
      // Components: common
      @import "sprites.less";
      @import "dropdowns.less";
      @import "wells.less";
      @import "component-animations.less";
      @import "close.less";
      
      ...
      
  13. Sad to see LESS getting so much support when Stylus and SASS are much more powerful and more actively developed.

    • Yohann Paris
      Permalink to comment#

      SASS as a bigger community, but doesn’t mean is the best. Both SASS and LESS have the same goal, but they target different person.

      I personally choose LESS because the syntax is so close to CSS that it doesn’t really look like a new language, more like a natural evolution of CSS.

  14. My first try was turbine: http://turbinecss.org/
    It was really great when I was using php.

    Nowadays I use SASS in all languages, and have configured an event in the git to compile and compress the SASS code in each commit/push in the dev server.

  15. Kenny
    Permalink to comment#

    I am in love with Scaffold to be quite honest…and for all you SASS whores it supports SASS and SCSS Syntax, if you must…. ^_^

  16. I have really enjoyed using stylus. Also, having used SASS for a project (vs. SCSS), I found I preferred the normal CSS syntax. Thats why SCSS or Stylus appeal to me.

  17. Permalink to comment#

    I’ve never tried any pre processors before, although I have wanted to. I actually feel a bit lost with the concept. Are there any good beginner tutorials to follow?

    • Chris
      Permalink to comment#

      Just get SASS running by following these installation instructions, then re-name your existing CSS files in a project to .scss, and go through it, replacing bits with SASS features as they are listed on the linked-to page. Maybe just start with nesting your rules, then try variables and mixins. The nice thing is that you don’t have to use any of the SASS features, so you can just try what you want to.

    • I am totally new to this too. I’ve heard people talk about it before but I just never knew what it actually was. Guess I should try it out, and see what its all about.

  18. Matt
    Permalink to comment#

    Don’t think I’ll ever build a site without SASS again. I’ve been on and off with it for a while, but I’ve gotten to the point where I catch myself using nested syntax in old-school CSS. That’s proof that I gotta have it ;)

  19. Justin
    Permalink to comment#

    LESS! Never got around trying SASS, since LESS hass all the features I need. I couldn’t live without mixins, or the “watch” function.

  20. I don’t use anything but my code editor. Am I lame for that? I dunno. Maybe I am.

    • Same here.

    • NetHawk
      Permalink to comment#

      Yeah, me too. Variables and mixins would be nice, but they belong into the regular CSS syntax, although, this will not happen for a long time…

  21. Sass (.scss) and Compass for anything serious, big and actual work. LESS for all sorts of prototype, testing, quick example, quick unit test, etc.

  22. Richard Grey
    Permalink to comment#

    I’ve try Less and Sass. First one have a nice syntax but Sass, I think, is stronger in his new scss syntax. Now I working on Sass.

  23. Permalink to comment#

    SASS & Compass

  24. SASS/SCSS

  25. Currently im a LESS user, I think that it brings nice enhancements without too much difference from actual CSS, being able to use a mixin without writing a prefix(@mixin), and other stuff, kind of saves me time, I’m a happy LESS user so far.

  26. Sébastien Degliame
    Permalink to comment#

    I use LESS for rapid prototyping and I learn SASS & Compass to manage more big project.

  27. I’d like to sue one of these nice preprocessors but have no knowledge of command line.

  28. For development, LESS has been awesome to work with.
    Before going live, I only use the minified CSS files.

    Am stuck between two parsers:
    LessParser
    SimpLESS
    Both work well.

  29. I’m using styleCow (https://github.com/oscarotero/styleCow), a css preprocessor written in php by me.

  30. Antonio
    Permalink to comment#

    Isn’t SASS for RoR only? I like using LESS because I can use it with HTML without setting up localhost.

  31. Permalink to comment#

    I use Sass. Started using .sass and switched to .scss to enhance compatibility with existing/old css files and team workers. Didn’t like Less as much as Sass, and Stylus feels like too much magic for me.

  32. Sam
    Permalink to comment#

    I’m using less with a very useful mac pre-compiler: http://incident57.com/less/
    really made my workflow a shitload easier :D

  33. Stylus is fantastic!
    I used to work with a PHP script made by me to concatenate files when needed in specific pages. On one of the final versions I started to to add preprocessor CSS syntax.

  34. Permalink to comment#

    I’m happy with Less.

  35. Despite being a Ruby guy, I prefer LESS.

  36. Evert
    Permalink to comment#

    Currently I use LESS but only on projects with complicated measurements or huge projects to improve maintainability.
    Small and simple projects I never use a preprocessor (I do not see the benefit?)
    However I hear great things about stylus so I will try it out sometime.

  37. Permalink to comment#

    Hi good morning,

    We are a web design in Barcelona, Madrid and wanted to give them the information sgracias provided by you.

    Thank you very much,

    regards

  38. Less is pretty much the best we have tried!

  39. Cary
    Permalink to comment#

    Anything around that enables use of SASS to generate jQueryUI-compatible CSS ? …or am I at cross-purposes by seeking to use both ?

    yeah – I know enough to be dangerous and that’s about it.

    Thanks in advance.

  40. Martin
    Permalink to comment#

    LESS undoubtedly

  41. Permalink to comment#

    Stylus.
    Tabs instead of semi-colons and colons.

  42. LessCSS Rocks!

  43. Scott Vivian
    Permalink to comment#

    I’ve tried LESS and SCSS, albeit briefly, and am not a huge fan. I feel like it makes it too easy to produce boated CSS with endless descendent selectors and repeated properties everywhere. I prefer the OOCSS paradigm.

    The only good part IMO is being able to define functions to handle vendor prefixes, and now we have prefix-free which does a better job at that.

    • Matt
      Permalink to comment#

      I’ve found that I ended up using SASS and Compass (in the SCSS syntax) to work in an OOCSS way (before I’d even read/heard about OOCSS), what’s interesting is that it means that you can get the maintenance win of OOCSS but still have semantic classes.

  44. Maybe I just dont know enough about them to understand the significance of them?

    Typically sites I work on have about 20 pages, but I’ve worked on sites that have 100+ pages. Even then I generally have a reset sheet, and one other (sometimes I will have a global then specialized sheets if a single page needs something funky. )

    Maybe I’m missing something in all of this though. I like that I can look through my style sheet and know where everything is (I keep them organized and documented). If I have a single reset sheet and a sheet that has say, 500 lines of CSS, is a pre-processor really going to save the end user tons of load time?

    • Permalink to comment#

      I am the same. I don’t see the advantage of all of this. I work the same as ChrisC.

    • You can minify the CSS file at compilation, but the benefits are mostly for you, I use LESS all the time to help me add vendor prefixes, to work with grids, to define variables so I don’t have to copy and paste color values, etc.

  45. Permalink to comment#

    SASS is for little girls and dummies true developers use LESS, because they are true!

    • Permalink to comment#

      I take offense to the ‘little girls’ comment.

    • Chris Clark
      Permalink to comment#

      True developers also avoid run-on sentences and foolish ‘X is for little girls’ comments.

  46. Wouter J
    Permalink to comment#

    I have tried them all (LESS, SASS, Stylus) and I’m get stick with Stylus.

    Why?

    I found LESS not very easy to work with. SASS is beautiful, the .sass syntax is the syntax I want CSS is written in. But stylus is the most flexible, nicest and fastest.
    If you use SASS it takes time before the stylesheet changes, in Stylus this time is almost zero.

    I also found the flexible way Stylus deal with syntaxes better than SASS and LESS.

  47. Permalink to comment#

    We use LESS on my team mostly because LESS PHP happened to work well in our existing build process. I’m hoping to try SASS on a persoanl project to see what I am supposedly missing. Honestly one of the biggest reasons I have avoided SASS is because the community just seems so vitriolic about it.

  48. I’ve been using LESS for a long time and love it. So much so that I’ve *forgotten* some of the full CSS syntax for some rules where I always use mixins, like .radius(12) instead of border-radius: 12px; yada yada.

    My compiler of choice is http://incident57.com/codekit/. This is the big brother version of http://incident57.com/less/. It rocks!

    Yes, you can @import whatever.less files and compile at once.

    BTW: I come from a designer background. Tried to grasp SASS/Compass a couple years ago. The Ruby gem thing was the blocker. LESS, on the other hand, was totally understandable and compiling locally (not using JS) has been my preferred work flow.

    • Permalink to comment#

      Yeah, Ruby was the blocker for me too.
      LESS just sucks you in with nicer syntax and faster setup using less.js.

  49. Gabe
    Permalink to comment#

    I finally started using a preprocessor on projects recently, and I semi-arbitrarily chose LESS over SASS because it seemed a little easier to get started with for someone like me who is too dam busy sit down and to learn stuff properly. I might give SASS a go at some point, because it looks like it has more to offer than LESS.

    But using LESS with CodeKit was so amazingly awesome right off the bat, that I’ll never ever go back. Like, within 10 minutes I had the giant nerd grin on my face for the first time in a long time.

    The ability to have a little mixin file that define all the colors, fonts, whatever of the whole project is just so awesome. And to never EVER have to write stupid, stupid vender prefixes? That alone is reason enough to make the jump!

  50. MK
    Permalink to comment#

    Stylus, because transparent mixins mean I can write standard CSS syntax:

    border-radius() {
    -webkit-border-radius: arguments;
    }

    .round-corners {
    border-radius: 5px;
    }

  51. I use LESS and I think it’s awesome, though if your careless, it can create code bloat. One feature that SASS has that I’d love to see in LESS is the @extend feature. Someone has written some code to add this to LESS, I’m hoping in gets rolled into the master version soon. https://github.com/cloudhead/less.js/pull/509

    The reason I started using LESS over SASS was that LESS was easier to set up and starting using than SASS. I couldn’t find a good explanation of how to set up SASS on a Windows machine.

  52. Permalink to comment#

    I use LESS with CodeKit. So so so easy to use.

  53. I prefer LESS, because its syntax is basically CSS with extra stuff, you don’t need to change the way you work.
    I do actually use pure CSS much more though for some reason.

  54. Davey
    Permalink to comment#

    I haven’t used any yet, but I’d be inclined to try Sass.

    For my current requirements though, it’s not really appropriate to use anything for css which needs to be built, because a bunch of people dip in and out of the code, and only one person has preprocessor experience.

    Maybe I’m wrong, but it looks to me like the most agile way to debug would be to use plain css.

  55. Ericka
    Permalink to comment#

    Question for the pre-processor users, I’m on .NET at work with a work laptop that I am not able to install much more than browsers to test our pages in. Will either LESS or SASS be applicable to this situation?

    • Yes!, use the less.js file to compile on the client

      Note that the CSS link is a .less file :-)

    • Scott
      Permalink to comment#

      Compiling client side is a terrible idea. If you are able to, install SimpLESS – it’s a tiny app that sits there and compiles your less code on the fly.

    • Etienne
      Permalink to comment#

      If you are using Visual Studio, you can use the Web Workbench plugin, which add intellisence, color highlighting and .Scss compilation & minification (.Less compilation in the pro version).

      http://www.mindscapehq.com/products/web-workbench

  56. Charlie Magee
    Permalink to comment#

    I went with LESS over SASS after looking at Twitter Bootstrap and Compass. The Twitter team put together a better looking, more readable, more concise, easy to understand set of pages describing their tool. I figured the underlying functionality would reflect that.

    Together with CodeKit and MAMP, my life is so much easier. Designing/coding is finally getting fun.

  57. Sam Atkins
    Permalink to comment#

    I’m waiting for some free time to try CSS Crush – it’s pretty-much just CSS syntax with extras, and it plugs into PHP really easily, which sounds perfect to me!

  58. Fulvio
    Permalink to comment#

    I started using CodeKit (currently free Beta) and LESS…with codekit’s support for external, selfmade framework css files my workflow is at the awesome level.

  59. Wow, I haven’t ever heard of a CSS preprocessor before… So is the main point of this to make sure that each rule you create covers every browser possibility?

    I’m totally going to start using Turbine, since I love coding PHP.

  60. Ian
    Permalink to comment#

    I have to admit, I didn’t know what a preprocessor was for css or why I would want to change the syntax when I have just gotten good at writing css without having to go googling for the right syntax.

    But I have tried the basics with less and can see the benefits. So, with less being the only one I’ve tried I can only vote for less.

  61. Permalink to comment#

    Another +1 for LESS, although it’s the only preprocessor I’ve used before. Almost no learning curve, couldn’t live without it now.

  62. I still have some problems with preprocessors. Some of them are explained in the following post:

    http://blog.millermedeiros.com/the-problem-with-css-pre-processors/

    (as English is not my native language I rely on someone who speaks it better than I do).
    In one of the comments I read that someone uses the minified generated css: I would hate to take over a website with code not commented properly. You can do that for a personal blog but never for a production site.

    • Ian
      Permalink to comment#

      Eelco,

      It’s my understanding that if a complete development life cycle method is used, the developer will provide the psd and the un-compiled css and js files to the site owner and they should be accessible to a new developer. Once the first developer minifies everything, then if they leave, I guess it would be up to the site owner to enforce the method. The next developer would use the un-compiled and un-minified dev version of the site to make changes and then compile and minify all the changes to upload to the production site. Of course I guess this depends on good devs following good practice.

    • In many instances preprocessors are better for commenting because they strip out comments in the compiled file, but this means you can be a lot more helpful (not to say long-winded) in the source file, because none of your comments will impact on the filesize of the compiled file.

      I find this really useful – I use TOCs in my LESS files now, along with in-line comments on what does what and when, where necessary. All in the knowledge that the compiled file will be a whitespace-free block of gzipped CSS which is blazing fast.

      Seems like the best of both worlds :)

  63. Chris
    Permalink to comment#

    Seriously, CSS-preprocessors are on of these things nobody really needs. Nice concept, but not for the real business.

    • Probably in a separate post but I would like to see a good discussion one WHY we would want these. To someone (myself) that hasn’t used them it seems counter productive to use something that strips down your readable and structured CSS into something else…and how much time are we REALLY talking about saving here? Even on a fairly big site. I don’t mean that facetiously either…I’d really like to know how much time we are talking about saving.

      I also read at least one comment that said something along the liens of “I have used LESS for so long I’ve almost forgotten how to write real CSS syntax.” Is that really a good thing?

      I’m hearing a lot of people say which ones they like (which was the point of Chris’s post so that is good) but I’m still not getting why this would be good thing to use.

    • Meant to add I can see the need for minification in something like jQuery, where you don’t modify the CSS but you are far more likely to need to make changes to CSS (especially if you are using it as it should be used, presentation). It just seems like an extra step you are taking to put CSS out there that is minified. How many of us started out with CSS by looking at other style sheets out there. I’m not sure but I’m guessing a minified sheet wouldn’t be nearly as easy to read (does it strip out comments?) OK, I’m done now. :-)

    • Gabe
      Permalink to comment#

      You trollin, bro?

      I could not disagree more. Used properly they can and will save so much time.

      Consider this: in a normal web design you tend to use a color palette of, say, 3-5 main colors, right? Say one of them is a red: #990000. With a preprocessor you define @red: #990000;

      From then on, you just write @red where you want that color:

      color: @red;

      Now let’s say you’re almost done with a project and the client says “gee, I’d like that red to be a juuust bit lighter”.

      Would you rather A) go around finding and replacing all of those #99000 declarations everywhere in your CSS, probably multiple times until you get the shade the client likes, or B) just tweak your @red variable in one single place and have the red color change site wide instantly. I’ll take B every time.

      This is is just one of the more simple benefits of using a preprocessor.

      But different strokes for different folks, I guess. If you like to do things totally manually, go for it.

      Saying things like this are not for “real business” is just silly, though.

    • Julian Cizmic
      Permalink to comment#

      @Gabe

      Isn’t that what find and replace was for?

  64. Martin Andersen
    Permalink to comment#

    SASS or LESS – never leave home without it (-:

    For the record I am using LESS

  65. pixelutely
    Permalink to comment#

    I’m with Scott on this one, OOCSS makes far more sense – especially when working on large-scale commercial applications that are build on OO code (e.g. .Net).

  66. I’ve tried SASS in an actual project and tinkered with some LESS to CSS app on Mac, but not in a project. For my work, since I’m not really a designer, is that nothing I do is so complicated that I need a preprocessor that adds another step into the workflow. And since I run on both Mac (MBA; on the go) and Windows (at home), it’s harder to use the terminal or app-based tools that automated those conversions.

  67. Antonio Lettieri
    Permalink to comment#

    I switch between compass/sass and less. Depends on the project, both options offer different benefits for me.

  68. Rochelle J. Brooks
    Permalink to comment#

    Wow, Awesome this is perfect sutff :)

  69. I wish I could have LESS syntax with all the SASS functionality :)

  70. Chris Greenhough
    Permalink to comment#

    I’m frankly bemused by all the self-confessed developers on this thread who don’t see the benefits of something like a CSS preprocessor. Do you guys write JS or PHP? Do you use any functions or variables in those, or do you prefer to just write everything out longhand every single time? Not very DRY is it?

    Personally I don’t think there’s much to choose between LESS and SASS although I agree LESS was the easier route initially. Broadly they do such similar things it depends which suits you best and I think we should all calm down about it :-)

    Not convinced about Stylus. Doesn’t it just encourage you to get used to writing really sloppy code?

    Oh, btw, I also used to try writing CSS with variables via PHP, which is fine and all that, but tbh life’s too short and there are not enough hours in the day as it is. If there’s a tool which lets me write normal CSS with just a little voodoo sprinkled on it then why not use it?

  71. I used LESS first then finally got my head wrapped around how SCSS/RUBY works. LESS is like SCSS with training wheels. I think it’s important to use a tool that makes CSS code that you like and can easily scan. I recently worked on someone elses code that was obviously processed. It was mostly line returns. Every 5th line was code. But I did master regular expressions fixing it.

    I don’t think it’s critical that you use a preprocessor, but I do think it is important to give it a try. Learn what it can do for you! *Then* decide it you want to use it!

  72. Digging into preprocessors for the first time, but so far LESS seems to be much more up my alley. It suits my front-end developer mindset much more than the alternatives.

  73. suprsidr
    Permalink to comment#

    On dynamic site I use php, otherwise SASS

    You should have had php as an option :-|

  74. Jeffrey Lo
    Permalink to comment#

    LESS

  75. Crazy surprising.

    I guess I have 40% of people to preach to regarding the brilliance of SASS and Compass. Use it people, It will change your life.

  76. Charbel
    Permalink to comment#

    Still haven’t had the guts to try any of them… I know, i’m missing out, but it’s a mix of not having enough time to actually experiment before applying to a real job. It will come… soon hopefully.

  77. diego
    Permalink to comment#

    sass and compass whenever i can – thanks to shoptalk for that one!

  78. siggi
    Permalink to comment#

    tried both, sass and less, out of curiosity;
    but to be true, i’m purist

  79. When I was first learning CSS (early 2000s, probably) I came across a scenario where calculating half of a dynamic width would be really useful.. I was scared of Javascript at the time so I thought maybe I could stick in a wee formula in the CSS to see if it worked. Needless (!) to say it didn’t, but when I finally discovered LESS last year this very feature seemed like an obvious and natural evolution of standard CSS to me. Add in the other stuff LESS does and the whole thing seems totally natural from a programming perspective while simultaneously respecting the simple roots of CSS.

    LESS is a lot easier to integrate into an existing LAMP build environment than SASS, especially with LessPHP as an option. I don’t use Ruby so it seems overkill to have to bootstrap it and all the SASS stuff for this one function. I do all my CSS live and compile-on-the-fly with LessPHP, using caching to make sure things aren’t getting compiled on every pageload. This way there’s no need for extraneous tools (offline compilers etc) which get in the way and complicate my workflow unnecessarily. Write the CSS (LESS) in Notepad++ or whatever (as I’ve always done), upload, and bob’s your uncle. Nothing new except the way the styles are writted.

  80. Despite the poll results, I’m seeing a lot of Sass fans in the comments. I’m not a big fan of Sass because it steers too far from CSS syntax (and yes, I’m talking about SCSS too).

    LESS literally takes CSS syntax, and makes it work better. So instead of introducing a new syntax for mixins, you can just use @import. And variables use @ instead of $ just like they were introduced in the CSS variables spec (plus, @ is used everywhere in CSS anyway). Everything just feel so natural.

    Now to contradict myself, if you want CSS to be syntaxed more like a programming language, then I can see why Sass might suit you.

  81. MarvinLeRouge
    Permalink to comment#

    I tried less, and it’s really useful on big projects, but you must be thorough on trying not to imply too much hierarchy if you don’t want your stylesheet to wheigh a ton.
    I wanted ti try scss, but the syntaxt caused me problems : some css rules simply crashed, which apparently means that scss is not a superset of css, and i want to be able to use any css rules in my pseudo-stylesheets.

  82. Is the .scss syntax and variables something that will possibly become standard CSS at some point? It just seems to make a lot of sense with nesting and such.

    I know you have to work locally with pre-processors but what if you just need to make a small edit? Can you just do the edit on the live .css file? And what happens if you later have to do major edits and need to do it locally? Will the small edit that was previously made to the live .css file be preserved or get over written?

  83. Permalink to comment#

    I tried LESS for awhile but I’ve been using SASS + Compass for awhile now, I’ve gotten everyone else at work to start using it too.

    At home on my Mac is use http://incident57.com/codekit/ for compilation and at work we are on PC’s and use http://compass.handlino.com/.

    SASS on it’s own is pretty good, but Compass is amazing all the CSS3 mixins make doing cross browser stuff a lot easier and the sprite helpers have made me actually start using sprites.

  84. LESS is fantastic for helping to write more efficient and organised CSS. After having a play with SASS and LESS, less was a smoother transition.

    However, we found there were a few features missing that would make writing CSS much more intuitive and accurate, so we developed a new preprocessor – http://morecss.org

    I’d encourage you guys to check it out and let us know what you think! @WriteMoreCSS

    • Qbit
      Permalink to comment#

      WOW! This language is so brilliant and is definitely missing in the poll. I have to convert all my projects to the MORE preprocessor system. :P

    • Permalink to comment#

      Someone took that joke too far!

      #footer h2 height: one-thousand-one-hundred-and-twenty-three pixels !unimportant;

  85. William malo
    Permalink to comment#

    I like stylus the best, but most servers don’t have node, so I wrote something similar in php and I use that…

This comment thread is closed. If you have important information to share, you can always contact me.

*May or may not contain any actual "CSS" or "Tricks".