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
300

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
160
Developing for Multiple Browsers
Avatar for Andrew Thal athal7
1
140
Scala
Avatar for Andrew Thal athal7
4
700
Guard & Growl
Avatar for Andrew Thal athal7
0
130
Git Aliases
Avatar for Andrew Thal athal7
6
140

Other Decks in Technology

See All in Technology
Exadata Database Service on Dedicated Infrastructure(ExaDB-D) UI スクリーン・キャプチャ集
Avatar for oracle4engineer oracle4engineer
PRO
2
5.4k
about #74462 go/token#FileSet
Avatar for tom twinkle tomtwinkle
1
290
Modern_Data_Stack最新動向クイズ_買収_AI_激動の2025年_.pdf
Avatar for Sagara sagara
0
200
E2Eテスト設計_自動化のリアル___Playwrightでの実践とMCPの試み__AIによるテスト観点作成_.pdf
Avatar for ファインディ株式会社（イベント資料アップ用） findy_eventslides
0
110
実装で解き明かす並行処理の歴史
Avatar for ZOZO Developers zozotech
PRO
1
320
業務自動化プラットフォーム Google Agentspace に入門してみる #devio2025
Avatar for maroon1st maroon1st
0
190
Goに育てられ開発者向けセキュリティ事業を立ち上げた僕が今向き合う、AI × セキュリティの最前線 / Go Conference 2025
Avatar for GMO Flatt Security flatt_security
0
350
ZOZOのAI活用実践〜社内基盤からサービス応用まで〜
Avatar for ZOZO Developers zozotech
PRO
0
170
GA technologiesでのAI-Readyの取り組み@DataOps Night
Avatar for yuto16 yuto16
0
270
後進育成のしくじり〜任せるスキルとリーダーシップの両立〜
Avatar for mtskhs matsu0228
6
2.2k
多野優介
Avatar for 多野優介 tanoyusuke
1
420
AWSにおけるTrend Vision Oneの効果について
Avatar for shima shimak
0
120

Featured

See All Featured
Why You Should Never Use an ORM
Avatar for John Nunemaker jnunemaker
PRO
59
9.6k
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
246
12k
Designing Experiences People Love
Avatar for Jonathan Moore moore
142
24k
Measuring & Analyzing Core Web Vitals
Avatar for Philip Tellis bluesmoon
9
610
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
48
51k
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
56
14k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
32
1.1k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
237
140k
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
28
4k
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
22k
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
11
880
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
114
20k

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?