Lock in $30 Savings on PRO—Offer Ends Soon! ⏳

Living Style Guides In Sass

Avatar for canarymason canarymason
October 16, 2012
Design
3
400

Living Style Guides In Sass

Presented at the NYC Sass Meetup (October 2012) at Pivotal Labs.

Avatar for canarymason

canarymason

October 16, 2012
Tweet

More Decks by canarymason

See All by canarymason
Mobile and Responsive Design with Sass
Avatar for canarymason canarymason
3
260
The Coding Designer's Survival Kit
Avatar for canarymason canarymason
8
510

Other Decks in Design

See All in Design
Ana Cortes Visual Development Portfolio 2025
Avatar for Ana Belen Cortes Diaz haruanleb
0
150
プロダクトリニューアルと同時に進める初めてのデザインシステム
Avatar for PERSOL CAREER Dev | techtekt techtekt
PRO
0
350
見栄えと使いやすさの先にある 特別感 をデザインする / Designing a Sense of Specialness Beyond Aesthetics and Usability
Avatar for 株式会社ビットキー / Bitkey Inc. bitkey
PRO
0
220
maki setoguchi
Avatar for Maki / Web Designer maki_setoguchi
0
600
ChatGPT、Gemini、Claude は、なぜ似たようなUIを採用しているのか？
Avatar for ふわり fuwarisprit
3
2k
チームをデザイン対象にする / Design for your team
Avatar for 株式会社カミナシ kaminashi
0
230
不確実性の時代にみんなで試したFigma × MCP × Cursor ハンズオン
Avatar for PERSOL CAREER Dev | techtekt techtekt
PRO
7
1.4k
kintone_aroma
Avatar for kintone kintone
0
1.1k
【Designship 2025｜10.11】デザイン組織と事業貢献、その挑戦と結果。
Avatar for payatsun payatsusan213
1
860
Installing and Running decksh/pdfdeck
Avatar for Anthony Starks ajstarks
1
910
文化のデザイン - Soft Impact of Design
Avatar for Atsushi Homma atsushihomma
0
110
Figmaレクチャー会Part1 基本のき編＠千株式会社 社内勉強会
Avatar for ぽん designer_no_pon
0
180

Featured

See All Featured
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
Avatar for Helen Beal helenjbeal
1
69
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
6k
Visual Storytelling: How to be a Superhuman Communicator
Avatar for David Neal reverentgeek
2
400
WCS-LA-2024
Avatar for Leonardo Collado-Torres lcolladotor
0
390
Agile Leadership in an Agile Organization
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
57
Documentation Writing (for coders)
Avatar for Carmen Chung carmenintech
77
5.2k
エンジニアに許された特別な時間の終わり
Avatar for watany watany
106
220k
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
331
21k
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
302
51k
The SEO Collaboration Effect
Avatar for Kristina Bergwall kristinabergwall1
0
310
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
Avatar for Yuki Nakata chikuwait chikuwait
0
230
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
174
15k

Transcript

  1. Living Style Guides & Sass Wednesday, October 17, 12

  2. Hi, I’m Mason @codingdesigner I design and make websites. I

    love CSS and Sass. Probably too much. Wednesday, October 17, 12

  3. I Make Sass Extensions github.com/canarymason Wednesday, October 17, 12

  4. Crazy things sassy mother effing text shadow sassymothereffingtextshadow.com Wednesday, October

    17, 12

  5. Modular Scale Calculate typographic scales github.com/scottkellum/modular-scale with @scottkellum Wednesday, October

    17, 12

  6. Breakpoint Really simple media queries in Sass breakpoint-sass.com with @snugug

    Wednesday, October 17, 12

  7. Survival Kit A Toolset for Designing Web Sites in the

    Browser thecodingdesigner.com/survivalkit Wednesday, October 17, 12

  8. Contact Me Zivtech zivtech.com Mason Wendell - Creative Director Twitter,

    Dribbble & Drupal: codingdesigner github: canarymason Wednesday, October 17, 12

  9. I Wednesday, October 17, 12

  10. Living Style Guides Wednesday, October 17, 12

  11. BBC GEL Wednesday, October 17, 12

  12. OLI.JP Wednesday, October 17, 12

  13. Zivtech.com Wednesday, October 17, 12

  14. What’s so great? Wednesday, October 17, 12

  15. Your style guide is a: Design Cop Wednesday, October 17,

    12

  16. Your style guide is a: Design Catalog Wednesday, October 17,

    12

  17. Your style guide is a: Design Sherpa Wednesday, October 17,

    12

  18. And Also: Code Teacher Responsive Ready Client Pleasing Institutional Memory

    Wednesday, October 17, 12

  19. II Wednesday, October 17, 12

  20. What’s Sass got to do with it? Wednesday, October 17,

    12

  21. Variables Define colors, dimensions, etc Wednesday, October 17, 12

  22. Mixins Abstract your design ideas into reusable formulas Wednesday, October

    17, 12

  23. Extend Put reused code into reusable silent selectors Wednesday, October

    17, 12

  24. Partials and Nesting Compartmentalize design modules Encourage more flexible and

    future-friendly styles Wednesday, October 17, 12

  25. Use Creativly Wednesday, October 17, 12

  26. Always be Refactoring Wednesday, October 17, 12

  27. What is a Sass, and How Will I Know if

    I’m Shaking it? Wednesday, October 17, 12

  28. Ship. Wednesday, October 17, 12

  29. Questions & Contact Zivtech zivtech.com Mason Wendell - Creative Director

    Twitter, Dribbble & Drupal: codingdesigner github: canarymason Wednesday, October 17, 12