CSS: Design Systems and Architectures

You'd never build a house without a blueprint, so why write CSS without a plan? A strong foundation makes CSS more scalable, reusable, and maintainable. Learn how to define a cohesive design system and robust architecture for your own CSS projects, in this course with Christina Truong. Christina shares strategies to help developers reimagine their workflow from the bottom up. Learn techniques for organizing and inventorying your styles, leveraging open-source frameworks such as Bootstrap, and storing UI patterns and components. Christina also shows how to architect CSS for reusability, using standardized formatting, classes, naming conventions, and templates. These techniques will help reduce the sprawl that seems endemic to web development, and help you become a more efficient, productive designer.

Learning objectives
The pros and cons of design systems
Open-source frameworks
Planning a design system
UI patterns and component libraries
Style guides
Building the CSS architecture
Formatting rules
Using standardized classes, naming conventions, and templates