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
310

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
700
Guard & Growl
Avatar for Andrew Thal athal7
0
140
Git Aliases
Avatar for Andrew Thal athal7
6
150

Other Decks in Technology

See All in Technology
全員が「作り手」になる。職能の壁を溶かすプロトタイプ開発。
Avatar for hokuto hokuo
1
660
日本語テキストと音楽の対照学習の技術とその応用
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
1
400
15 years with Rails and DDD (AI Edition)
Avatar for Andrzej Krzywda andrzejkrzywda
0
120
SREの仕事を自動化する際にやっておきたい5つのポイント
Avatar for Kazuto Kusama jacopen
6
1.2k
GCASアップデート（202510-202601）
Avatar for 高橋広和 techniczna
0
230
Tebiki Engineering Team Deck
Avatar for Tebiki, Inc. tebiki
0
23k
Amazon Bedrock AgentCore EvaluationsでAIエージェントを評価してみよう！
Avatar for Yudai Jinno yuu551
0
200
Data Hubグループ 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
0
2.7k
usermode linux without MMU - fosdem2026 kernel devroom
Avatar for Hajime Tazaki thehajime
0
120
漸進的過負荷の原則
Avatar for SansanTech sansantech
PRO
3
430
予期せぬコストの急増を障害のように扱う――「コスト版ポストモーテム」の導入とその後の改善
Avatar for Masahiro Yoshizawa muziyoshiz
0
380
3分でわかる！新機能 AWS Transform custom
Avatar for sato4mi sato4mi
1
280

Featured

See All Featured
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
187
22k
SEOcharity - Dark patterns in SEO and UX: How to avoid them and build a more ethical web
Avatar for Sara Fernández Carmona sarafernandez
0
110
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
Avatar for Michelle Schulp Hunt marktimemedia
31
2.7k
We Analyzed 250 Million AI Search Results: Here's What I Found
Avatar for Josh Blyskal joshbly
1
600
Designing Experiences People Love
Avatar for Jonathan Moore moore
144
24k
How to Talk to Developers About Accessibility
Avatar for Jason CranfordTeague jct
2
120
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
141
7.3k
Understanding Cognitive Biases in Performance Measurement
Avatar for Philip Tellis bluesmoon
32
2.8k
The Hidden Cost of Media on the Web [PixelPalooza 2025]
Avatar for Tammy Everts tammyeverts
2
150
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
Avatar for Kenny Baas-Schwegler baasie
0
220
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
17k
Fashionably flexible responsive web design (full day workshop)
Avatar for Andy Clarke malarkey
408
66k

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?