Upgrade to Pro — share decks privately, control downloads, hide ads and more …

SCSS vs LESS

Avatar for Andrew Thal Andrew Thal
April 20, 2012
Technology
4
320

SCSS vs LESS

Comparing and contrasting two CSS alternatives

Avatar for Andrew Thal

Andrew Thal

April 20, 2012
Tweet

More Decks by Andrew Thal

See All by Andrew Thal
The Thank You Economy
Avatar for Andrew Thal athal7
0
170
Developing for Multiple Browsers
Avatar for Andrew Thal athal7
1
150
Scala
Avatar for Andrew Thal athal7
4
710
Guard & Growl
Avatar for Andrew Thal athal7
0
140
Git Aliases
Avatar for Andrew Thal athal7
6
160

Other Decks in Technology

See All in Technology
内製AIチャットボットで学んだDatadog LLM Observability活用術
Avatar for k.masachika mkdev10
0
100
親子 or ペアで Mashup for the Future！ しゃべって楽しむ 初手AI駆動でものづくり体験
Avatar for hiroramos hiroramos4
PRO
0
110
8万デプロイ
Avatar for iwamot iwamot
PRO
2
240
身体を持ったパーソナルAIエージェントの 可能性を探る開発
Avatar for yoko / Naoki Yokomachi yokomachi
1
110
AWS DevOps Agent vs SRE俺 / AWS DevOps Agent vs me, the SRE
Avatar for SMS tech sms_tech
3
570
製造業ドメインにおける LLMプロダクト構築： 複雑な文脈へのアプローチ
Avatar for recruiting@caddi.jp caddi_eng
1
560
決済サービスを支えるElastic Cloud - Elastic Cloudの導入と推進、決済サービスのObservability
Avatar for suzukij suzukij
2
620
Yahoo!ショッピングのレコメンデーション・システムにおけるML実践の一例 
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
1
200
生成AIの利用とセキュリティ /gen-ai-and-security
Avatar for Masayoshi Mizutani mizutani
1
1.7k
「Blue Team Labs Online」入門 - みんなで挑むログ解析バトル
Avatar for Noriaki Hayashi v_avenger
0
160
僕、S3 　シンプルって名前だけど全然シンプルじゃありません　よろしくお願いします
Avatar for Yuuki Yamashita yama3133
1
210
IBM Bobを使って、PostgreSQLのToDoアプリをDb2へ変換してみよう/202603_Dojo_Bob
Avatar for Mayumi Hirano mayumihirano
1
330

Featured

See All Featured
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
378
71k
B2B Lead Gen: Tactics, Traps & Triumph
Avatar for Sophie Logan marketingsoph
0
76
How to audit for AI Accessibility on your Front & Back End
Avatar for davetheseo davetheseo
0
210
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
141
7.4k
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
Avatar for David Carrasco davidcarrasco
3
71
A better future with KSS
Avatar for Kyle Neath kneath
240
18k
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
Avatar for Ryan Jones ryanjones
0
91
What’s in a name? Adding method to the madness
Avatar for The Alliance productmarketing
PRO
24
4k
So, you think you're a good person
Avatar for Per Axbom axbom
PRO
2
2k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
133
19k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
Avatar for Mine Cetinkaya-Rundel minecr
1
190
SEO in 2025: How to Prepare for the Future of Search
Avatar for Michael King ipullrank
3
3.4k

Transcript

  1. SCSS vs LESS What's the dif?

  2. Why CSS Sucks

  3. Why CSS Sucks Repetitive code

  4. Why CSS Sucks Long calls (no nesting)

  5. Why CSS Sucks "Magic" Numbers

  6. Necessary Boring Part

  7. Syntactically Awesome Stylesheets Earlier versions inspired by HAML Version 3

    SCSS (Sassy CSS) - CSS OK SASS/SCSS

  8. Creator: Alexis Sellier (cloudhead) Can use in Belorussian LESS

  9. Feature Nesting Operations, Flow control Selector Inheritance Compiles in the

    browser SCSS LESS Feature Comparison

  10. Feature Variables Mixins String Interpolation JS Evaluation SCSS $ @mixin

    #{} none LESS @ . #{} `"hello".toUpperCase() + '!'` Syntax Differences

  11. Dude, show me the code already

  12. SCSS CSS

  13. LESS CSS

  14. CSS 742 SCSS 748 Character comparison LESS 704

  15. So what should I use?

  16. None

  17. fewer characters (@mixin vs .) bootstrap compiles in js -SCSS

    needs compiler outside of Ruby Why?