Out-of-the-box Bootstrap looks recognizable—production apps rebrand via Sass variables or CSS custom properties. Bootstrap 5 exposes --bs-primary, --bs-body-font-family, and dozens of tokens on :root you can override after importing the CSS.
Sass vs CSS variables
- Sass compile-time — change
$primary,$border-radiusbefore build; smallest output, full control - Runtime CSS variables — override
--bs-*in a small custom stylesheet for white-label tenants
Pair token changes with component audits—buttons update automatically, but hard-coded hex in your own CSS will not. Compare compile-time theming with Sass tracks when your team already uses a preprocessor pipeline.
Important interview questions and answers
- Q: Sass variables vs CSS variables for Bootstrap?
A: Sass variables compile away and shrink output; CSS variables enable runtime theming (per user or tenant) without rebuilding Bootstrap. - Q: What breaks if you only change button markup?
A: Non-Bootstrap elements and custom hex colors stay old-brand unless you update tokens or remove hard-coded values.
Self-check
- Name one
--bs-*variable you would override for brand color. - When is recompiling Sass preferable to runtime variables?
- What is one sign you customized too little of the stack?