Last Updated: February 25, 2016
·
2.64K
· luizbranco

Nib: CSS mixins for Stylus.js

If you have been using Stylus.js, you might want to check nib. It is a collection of CSS mixins and utilities, similar to Compass or Bourbon.

To install:

npm install nib

var connect = require('connect')
 , stylus = require('stylus')
 , nib = require('nib');

var server = connect();

function compile(str, path) {
 return stylus(str)
 .set('filename', path)
 .set('compress', true)
 .use(nib());
}

server.use(stylus.middleware({
 src: __dirname
 , compile: compile
}));

You can import all nib utilities in your .styl files:

@import 'nib' 

or just a specific part of it:

@import 'nib/vendor' 

Then you are ready to go, for e.g.:

border-radius(top left 5px, bottom left 5px)

1 Response
Add your response

Good tip. You could also just download and grab the best ones from http://bourbon.io and/or Compass. Make your own framework in CodeKit or just @import. Converting them into Stylus syntax from Sass isn't that hard.

over 1 year ago ·