Descartes | Write CSS in JavaScript
JavaScript CSS HTML
Switch branches/tags
Nothing to show
Clone or download
Latest commit ee2ab13 Aug 22, 2016


by Jon Chan @jonhmchan

This is an experimental library for writing CSS in JavaScript. The current version is a beta and highly unstable, with changes happening on a daily basis. This library is not recommended for production use. It is actively being developed with your help.


  1. Download descartes.js from the dist folder

  2. Set up Descartes in a webpage by inserting it in your <head> tag, like so:

    <!doctype html>
    		<script type="text/javascript" src="/path/to/descartes.js"></script>
    		<h1>I compute, therefore I am.</h1>
    		<script type="text/javascript" src="/path/to/styles.js"></script>
  3. Create a styles.js where you will write your styles. Try the following:

Descartes.add({ "body": { "color": "#555", "font-family": "Arial", "h1": { "font-family": "Helvetica", "font-size": function() { return 16 + Math.round(Math.random() * 42); } } } }) ```

  1. Save and open up your HTML file in a browser. Clicking anywhere on the window should randomize the size of your heading.


For a full overview of features, take a look at the presentation I typically give at (just your right and left arrow keys to go through the slides).