Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

SCSS vs LESS

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

SCSS vs LESS

Comparing and contrasting two CSS alternatives

Avatar for Andrew Thal

Andrew Thal

April 20, 2012

More Decks by Andrew Thal

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

Other Decks in Technology

See All in Technology
(swiftc) NonCopyableとライフタイム修飾子
Avatar for Himeshi teamhimeh
0
130
ガチで放置できるClaude Code実行環境の作り方.pdf
Avatar for Lamaglama39 lamaglama39
5
9.8k
演劇と私とスクラム
Avatar for Tomonori Fukuta chinmo
0
160
書き手が人でもAIでも正しくなる道、 SREを埋め込んだDeveloper Platform / tech drivers day8
Avatar for mekka chmikata
4
770
顧客価値を追いかけたら、プライシングにたどり着いた
Avatar for SansanTech sansantech
PRO
2
1k
Obsidian Vault Architectures
Avatar for Daisuke Masuda x5gtrn
PRO
0
170
ドメインエキスパートは いかにして AI を使って プロダクト開発をするか
Avatar for tshiraishi tatsuyashiraishi
1
200
プロダクトが成長すると、 プロダクトマネージャーの仕事はどう変わるのか － 「まず作る」から「小さく学び、確かめながら進む」へ
Avatar for SansanTech sansantech
PRO
1
380
Kiro Crewで「みのるん式」仕事術やってみた
Avatar for みのるん minorun365
PRO
3
1.1k
データマネジメント × 法務で作りあげる、 freeeの新しいデータガバナンスへの軌跡
Avatar for freee freee
PRO
1
440
撮るだけでは終わらない。ソニーが挑むB2Bカメラソリューション開発
Avatar for ソニー株式会社 sony
0
110
日本AIベンチャーレポート2026
Avatar for KentaroFujii kentarofujii
0
240

Featured

See All Featured
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9.8k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
666
130k
Crafting Experiences
Avatar for Bethany Jepchumba bethany
1
390
JavaScript: Past, Present, and Future - NDC Porto 2020
Avatar for David Neal reverentgeek
52
6.1k
How GitHub (no longer) Works
Avatar for Zach Holman holman
316
150k
Leading Effective Engineering Teams in the AI Era
Avatar for Addy Osmani addyosmani
9
2.8k
My Coaching Mixtape
Avatar for mlcsv mlcsv
0
360
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
2.2k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
163
24k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
Avatar for Joe Casabona jcasabona
35
2.9k
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
250
1.3M
Claude Code のすすめ
Avatar for schroneko schroneko
67
230k

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?