intermediate

Styling architecture

BEM, CSS Modules, CSS-in-JS, utility CSS, Tailwind, design tokens, ownership, and scaling trade-offs.

Styling architecture interviews explore how teams scale CSS without override wars: naming conventions, build-time scoping, runtime styling, utility systems, and shared design tokens.

Subtopics: BEM, CSS Modules, CSS-in-JS, Tailwind, and design tokens.

On interviews: compare trade-offs for a growing design system — isolation, SSR, theming, bundle cost, and who owns global styles.

Common pitfalls: picking one approach for every team, tokens named after hex values, and scoping that ignores cascade order.

Checklist:

  • Match architecture to team size and runtime constraints.
  • Separate raw and semantic design tokens.
  • Document global layer and override policy.
  • No single approach fits every product.