Stylus logo

Stylus

Expressive, robust, feature-rich CSS language built for nodejs
441
409
+ 1
331

What is Stylus?

Stylus is a revolutionary new language, providing an efficient, dynamic, and expressive way to generate CSS. Supporting both an indented syntax and regular CSS style.
Stylus is a tool in the CSS Pre-processors / Extensions category of a tech stack.
Stylus is an open source tool with 11.2K GitHub stars and 1.1K GitHub forks. Here’s a link to Stylus's open source repository on GitHub

Who uses Stylus?

Companies
99 companies reportedly use Stylus in their tech stacks, including Discord, Accenture, and Coursera.

Developers
291 developers on StackShare have stated that they use Stylus.

Stylus Integrations

Pros of Stylus
69
Simple
54
Indented syntax
38
Efficient
33
Built for node.js
32
Open source
24
Expressive
21
Maintainable
17
Feature-rich
13
Better than CS
6
Variables
5
Functions
3
@extend directive
2
Contempt for curly brackets
2
Very clean
2
Mixins
2
Is Easy
2
No colons, semi-colons or even curly braces
1
Its unique
1
Dynamic selectors
1
Scriptable
1
Easy Efficiently
1
Transparent
1
Supports orthogonal architecture
Decisions about Stylus

Here are some stack decisions, common use cases and reviews by companies and developers who chose Stylus in their tech stack.

awesomebanana2018
Needs advice
on
PostCSSPostCSSSassSass
and
StylusStylus

Originally, I was going to start using Sass with Parcel, but then I learned about Stylus, which looked interesting because it can get the property values of something directly instead of through variables, and PostCSS, which looked interesting because you can customize your Pre/Post-processing. Which tool would you recommend?

See more

Blog Posts

JavaScriptGitHubGit+33
20
2080
Jun 19 2015 at 6:37AM

ReadMe.io

JavaScriptGitHubNode.js+25
12
2344

Stylus Alternatives & Comparisons

What are some alternatives to Stylus?
Sass
Sass is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It's translated to well-formatted, standard CSS using the command line tool or a web-framework plugin.
Animate.css
It is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.
css-loader
The css-loader interprets @import and url() like import/require() and will resolve them.
Autoprefixer
It is a CSS post processor. It combs through compiled CSS files to add or remove vendor prefixes like -webkit and -moz after checking the code.
Less
Less is a CSS pre-processor, meaning that it extends the CSS language, adding features that allow variables, mixins, functions and many other techniques that allow you to make CSS that is more maintainable, themable and extendable.
See all alternatives

Stylus's Followers
409 developers follow Stylus to keep up with related blogs and decisions.