Cool beans! I'm coming at this from a Windows perspective, but this should work well in Linux or Mac as well.
-
Install NodeJS. On Windows, you go to the website, run the installer, and click "Next" a few times. http://nodejs.org/
-
Install stylus using NodeJS's package manager, npm, which has been automatically installed for you. Open a terminal and run:
npm install -g stylus -
Create your Stylus code and save it as something like my-styles.styl. You can probably rename your existing .css file to .styl without changing anything else.
-
To compile the Stylus code into css, go to your terminal and run:
stylus my-styles.styl -
Optionally, Stylus can watch your files and automatically re-compile your CSS every time you change the .styl file. Add "-w" to the command:
stylus -w my-styles.styl
Learn about Stylus here: http://learnboost.github.io/stylus/
Play with Stylus code in your web browser here: http://learnboost.github.io/stylus/try.html
If you want a ton of extra features, try adding Axis to the mix: http://roots.cx/axis/
To use Axis in your stylus code, first install it:
npm install -g axis
Then tell Stylus to use the axis library by adding "-u axis" to the command:
stylus -u axis my-styles.styl