Need advice about which tool to choose?Ask the StackShare community!

Pug

1.2K
1.2K
+ 1
467
Stylus

426
410
+ 1
331
Add tool

Pug vs Stylus: What are the differences?

What is Pug? Robust, elegant, feature rich template engine for nodejs. This project was formerly known as "Jade." Pug is a high performance template engine heavily influenced by Haml and implemented with JavaScript for Node.js and browsers.

What is Stylus? Expressive, robust, feature-rich CSS language built for nodejs. 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.

Pug belongs to "Templating Languages & Extensions" category of the tech stack, while Stylus can be primarily classified under "CSS Pre-processors / Extensions".

"Elegant html" is the top reason why over 118 developers like Pug, while over 65 developers mention "Simple" as the leading cause for choosing Stylus.

Pug is an open source tool with 18.4K GitHub stars and 1.9K GitHub forks. Here's a link to Pug's open source repository on GitHub.

According to the StackShare community, Pug has a broader approval, being mentioned in 174 company stacks & 119 developers stacks; compared to Stylus, which is listed in 69 company stacks and 45 developer stacks.

Advice on Pug and Stylus
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
Replies (2)
Recommends
on
PostCSSPostCSS

You're not correct with saying "vs Postcss". You're using Less/Sass/Stylus/... to produce "CSS" (maybe extended means it has some future features) and then in any case PostCSS will play (it is shipped with Parcel/NextJS/CRA/...)

See more
Get Advice from developers at your company using StackShare Enterprise. Sign up for StackShare Enterprise.
Learn More
Pros of Pug
Pros of Stylus
  • 138
    Elegant html
  • 90
    Great with nodejs
  • 59
    Open source
  • 59
    Very short syntax
  • 54
    Structured with indentation
  • 25
    Free
  • 6
    Really similar to Slim (from Ruby fame)
  • 6
    It's not HAML
  • 6
    Gulp
  • 5
    Clean syntax
  • 5
    Readable code
  • 5
    Easy setup
  • 5
    Difficult For Front End Developers,learn backend
  • 4
    Disdain for angled brackets
  • 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

Sign up to add or upvote prosMake informed product decisions

- No public GitHub repository available -

What is Pug?

This project was formerly known as "Jade." Pug is a high performance template engine heavily influenced by Haml and implemented with JavaScript for Node.js and browsers.

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.

Need advice about which tool to choose?Ask the StackShare community!

What companies use Pug?
What companies use Stylus?
See which teams inside your own company are using Pug or Stylus.
Sign up for StackShare EnterpriseLearn More

Sign up to get full access to all the companiesMake informed product decisions

What tools integrate with Pug?
What tools integrate with Stylus?

Sign up to get full access to all the tool integrationsMake informed product decisions

Blog Posts

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

ReadMe.io

JavaScriptGitHubNode.js+25
12
2361
What are some alternatives to Pug and Stylus?
EJS
It is a simple templating language that lets you generate HTML markup with plain JavaScript. No religiousness about how to organize things. No reinvention of iteration and control-flow. It's just plain JavaScript.
Handlebars.js
Handlebars.js is an extension to the Mustache templating language created by Chris Wanstrath. Handlebars.js and Mustache are both logicless templating languages that keep the view and the code separated like we all know they should be.
React
Lots of people use React as the V in MVC. Since React makes no assumptions about the rest of your technology stack, it's easy to try it out on a small feature in an existing project.
TypeScript
TypeScript is a language for application-scale JavaScript development. It's a typed superset of JavaScript that compiles to plain JavaScript.
Mustache
Mustache is a logic-less template syntax. It can be used for HTML, config files, source code - anything. It works by expanding tags in a template using values provided in a hash or object. We call it "logic-less" because there are no if statements, else clauses, or for loops. Instead there are only tags. Some tags are replaced with a value, some nothing, and others a series of values.
See all alternatives