Skip to content
Go to file

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time

Yet Another Stylus Renderer

Build Status npm version npm dependencies Coverage Status

A Stylus renderer for Hexo that uses Nib, Axis, Rupture, Jeet, and Typographic. It used to have Autoprefixer but it got deprecated, so I had to let it go. For now.

Please use Hexo version 3.0.0 or above. This doesn't support 2.x.x and never will.


Integrated libraries

Some libraries ask you to place @import [library] in your .styl file. YASR takes care of this for you. To use a library you just have to enable it in the _config.yml and start using it.

Source Maps

YASR can output sourcemaps to your CSS files. This is provided by Stylus, so if you encounter any bugs, let the Stylus developers know.

Warning: Some libraries can cause problems with sourcemaps.

Load properties from the theme configuration

The render is now able to fetch properties that are defined inside the theme configuration file and place them in your CSS.

I got the code from the original hexo-renderer-stylus.

Theme's _config.yml:

img: ''


  background-image hexo-config('img')

Resulting CSS:

.class {
  background-image: '';


We use Stylus built in compression flag to minify the outputted CSS files.


Check to see if you have installed hexo-renderer-stylus (check inside the node-modules directory, but don't delete it.). If you have it installed run:

npm un hexo-renderer-stylus --save

After you've removed the default renderer, or if you never installed it in the first place, run:

npm i hexo-renderer-yasr --save


Place the following code inside your _config.yml.

# YASR Configuration
## Docs:
  axis: true              # Enables Axis (Recommends Nib)
  compress: false         # Disables Compression
  jeet: true              # Enables Jeet
  nib: true               # Enables Nib
  rupture: true           # Enables Rupture
  typographic: true       # Enables Typographic
  sourcemaps:             # Sourcemaps configuration
    comment: true
    inline: true
    sourceRoot: ''
    basePath: 'css/'
  • Sourcemaps
    • comment - Adds a comment with the sourceMappingURL to the generated CSS (default: true)
    • inline - Inlines the sourcemap with full source text in base64 format (default: false)
    • sourceRoot - sourceRoot property of the generated sourcemap
    • basePath - Base path from which sourcemap and all sources are relative (default: .)


A Stylus CSS renderer for Hexo that uses Nib, Axis, Rupture, Jeet, Typographic and Autoprefixer.




No releases published
You can’t perform that action at this time.