Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Collaborative Style Syntax

Collaborative Style Syntax

There comes a time when designing a front-end styling system with the traditional values of OOCSS/BEM/SMACSS doesn't work. In order to build a slim, efficient, and flexible CSS codebase, I turned to projects like BassCSS and Tachyons for inspiration and found answers for not just the architectural challenges but communication challenges when using CSS in cross-functional teams.

This presentation covers a quick overview of "functional" CSS and how it's being used at Namely to establish a Collaborative Style Syntax.


October 20, 2015

More Decks by HipsterBrown

Other Decks in Programming


  1. Nick Hehr • empathetic community member • front-end developer at

    Namely • Hoodie & Tessel Contributor • Mustached Human • @hipsterbrown
  2. Consistency • Shared Jargon (i.e. “what’s a popover?”) • Sensible

    Defaults • Abstracted Values (rems, hex colors, etc)
  3. Namely UI • Flexible set of React components • Library

    of functional CSS utilities • Self-Documenting (nearly) via static site