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
「Learning Outcome」を書きたくない私が、Learning Outcomeと折り合いをつけるまで
Avatar for リリカル mhlyc
0
240
ガチで放置できるClaude Code実行環境の作り方.pdf
Avatar for Lamaglama39 lamaglama39
5
9.8k
Vue.jsのGitHubから学ぶ意思決定
Avatar for Yuto Nagai(Future) yut0naga1_fa
1
290
2026-10-24 JAWS JAWS-UG 茨城 #18 IAM Policy Autopilotってなにさ。terraform planからIAM Policyつくれるの? / What's IAM Policy Autopilot
Avatar for SUZUKI Masashi masasuzu
0
170
Claude for Google Workspaces ポン出し/claude-for-google-workspace-slide-conversion
Avatar for emi emiki
0
13k
Claude Code をローカルとサーバー上で利用した際の Bedrock 利用料をユーザー単位で一本化してみる
Avatar for Osamu Horiguchi ohorig
0
160
Devin プロモコードの受け取りと適用(2026.10.27)
Avatar for kinopee kinopeee
1
570
書き手が人でもAIでも正しくなる道、 SREを埋め込んだDeveloper Platform / tech drivers day8
Avatar for mekka chmikata
4
770
Claude Codeから見る、エンジニアの世界の変容とその先
Avatar for Oikon oikon48
7
4.4k
[re:Invent2026事前勉強会(有志開催)]続きは、ラスベガスの廊下で / continue-in-the-vegas-hallway
Avatar for sh_fk2 sh_fk2
0
280
AIで選択肢が広がった組織設計の理想と現実
Avatar for konifar konifar
14
5.9k
バフェットコード開発チームの心得（v1.1）
Avatar for Shu Suzuki shoe116
0
110

Featured

See All Featured
First, design no harm
Avatar for Per Axbom axbom
PRO
2
1.4k
Test your architecture with Archunit
Avatar for Yoan thirion
2
2.5k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9.8k
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
Avatar for Aleyda Solis aleyda
1
2.2k
Scaling GitHub
Avatar for Zach Holman holman
464
140k
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
187
23k
Writing Fast Ruby
Avatar for Erik Berlin sferik
630
63k
Marketing Yourself as an Engineer | Alaka | Gurzu
Avatar for Gurzu gurzu
0
330
The Impact of AI in SEO - AI Overviews June 2024 Edition
Avatar for Aleyda Solis aleyda
6
1.2k
How GitHub (no longer) Works
Avatar for Zach Holman holman
316
150k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
1.3k
Ethics towards AI in product and experience design
Avatar for Skipper Chong Warson skipperchong
2
440

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?