Divshot Alloy: A Web API for CSS Preprocessor Compilation

In the past few years CSS preprocessors have become a way of life for many if not most web developers. Adding functionality such as modularity, nesting, mixins, and functions, these tools make it much easier. So much easier, in fact, that going back to writing vanilla CSS can start to feel like a drag.

There are lots of sites out there that allow for users to input custom CSS, but these sites almost never offer options for preprocessors. Of course, even if they want to, there are three popular choices for a preprocessor: SASS, LESS, and Stylus. Two of these run in Javascript, one in Ruby. Even beyond that, SASS and Stylus each have popular libraries of mixins that many users depend upon. What's the way forward?

Divshot Alloy is our new, open- source web API for compiling CSS with any of the popular preprocessors. It supports SASS, LESS, and Stylus (as well as Compass for SASS and Nib for Stylus). Utilizing Cross-Origin Resource Sharing (CORS) it can also be called directly from the browser.

We hope that this will give developers who are offering tools that have custom CSS a simple way to support the most common CSS preprocessors.

Usage

To use the API, just make a POST to [[http://alloy.divshot.com/compile](htt p://alloy.divshot.com/compile)](http://alloy.divshot.com/compile) with these parameters:

• source: the source you want to compile
• type: can be any of sass, scss, less, or stylus
• compress: if set to true the resulting CSS will be compressed

Here's a simple example using jQuery's AJAX API:

$.ajax({ url: "http://alloy.divshot.com/compile", type: "POST", dataType: "text", data: { compress: true, type: "sass", source: "body
 color: blue" }, success: function(css) { $("#some-element").text(css); } }); 

It's that simple! You can find more detailed information on the Alloy docs site as well as an in-browser test. We have some ideas to make Alloy even better, but if you've been looking for a way to easily incorporate multiple preprocessors into your app, hopefully this will help.