Register for Workshop Get Smacked! Sign in
Stack of books. Because you want more than one.

“SMACSS is becoming one of the most useful contributions to front-end discussions in years” *

I’ve been analyzing my process (and the process of those around me) and figuring out how best to structure code for projects on a larger scale. What I've found is a process that works equally well for sites small and large.

Learn how to structure your CSS to allow for flexibility and maintainability as your project and your team grows.

Get smacked!

What is it?

SMACSS (pronounced “smacks”) is more style guide than rigid framework. There is no library within here for you to download or install. SMACSS is a way to examine your design process and as a way to fit those rigid frameworks into a flexible thought process. It is an attempt to document a consistent approach to site development when using CSS. And really, who isn’t building a site with CSS these days?!

Get to know Scalable and Modular Architecture for CSS:

Get the Book

Purchase the book in print or e-book format — or both! The e-book comes in PDF, ePub and mobi formats for easy installation on almost any e-reader. The e-book purchase also includes access to screencasts on smacss.com.

Free Online Book

SMACSS started out as a free online book and that continues to be true. You can always read the original chapters. For access to premium content, you will need to buy the e-book.

Workshops

I’m touring the world sharing my experience in building small and large scale web sites. The SMACSS Workshop covers the modularization of code, progressive enhancement, working with larger teams, prototyping, and plenty more. We’ll look at actual projects supplied by attendees and step through real examples. Sign up for the mailing list, if you haven't already, to be kept up to date on when and where the workshops will be held.

So, what are you waiting for? Get smacked!

What's in SMACSS?

Preface

  1. About the Author
  2. Introduction

Core

  1. Categorizing CSS Rules
  2. Base Rules
  3. Layout Rules
  4. Module Rules
  5. State Rules
  6. Theme Rules
  7. Changing State

Aspects of SMACSS

  1. Depth of Applicability
  2. Selector Performance
  3. HTML5 and SMACSS
  4. Prototyping

Aspects (cont) Premium access

  1. Preprocessors
  2. Drop the Base
  3. The Icon Module
  4. Complicated Inheritance
  5. Screencast: Applying the Principles
  6. Screencast: Avoiding Content-specific Context

Appendix

  1. Formatting Code
  2. Resources

What people have to say

“This should be required reading for anyone who opens a CSS file.”

Josh Walsh

“SMACSS is becoming one of the most useful contributions to front-end discussions in years.”

Paul Smith

“Possibly one of the best publications so far. IMO a must have for anyone working on the front end.”

Matteo Pescarin

“[SMACSS] is required reading for anyone who will ever touch CSS. Hard earned wisdom that few mavens have even mastered”

Thomas Aylott

“Snook’s book is not only highly readable, it’s chock full of examples that will help you wrangle your code into something more manageable”

Scott Gilbertson at webmonkey

“it has great thoughts on architecting maintainable CSS for larger sites”

Greg Rewis in .net magazine

← Home | ↑ Top of Page

Subscribe to the Mailing List

Plenty more content, links, and even workshops to come. Stay up to date with all of it by .

Powered by MailChimp.

About SMACSS

Scalable and Modular Architecture for CSS is an approach to web development written by me, Jonathan Snook. You can reach me on my blog at Snook.ca or on Twitter at @snookca.

Privacy Policy | Terms and Conditions | Contact

© Snook.ca Web Development, Inc. All rights reserved.