Introduction ​

This design system is a warm-paper interface layer on Bootstrap 5: tokens, typography, and component patterns so product screens stay consistent.

What you get ​

  • Theme — compiled overlay CSS (sqrl-theme.min.css) on top of Bootstrap 5; Quick start has the <link> tags.
  • Docs — Design foundations and component examples you can copy into an app. One-file copy for AI: design.md.
  • Principles — One clear primary action per view; follow-up and conversion first.

Who this is for ​

Designers and developers working on product UI. You should be comfortable with HTML and Bootstrap utility classes; the theme handles the rest.

Source tags ​

Component pages show small tags under the title (or under a section heading when only part of the page is custom):

Bootstrap Sqrl custom

  • Bootstrap — standard Bootstrap 5 markup; theme.scss maps Sqrl tokens onto these classes.
  • Sqrl custom — extra classes or patterns Bootstrap does not ship (sq-*, btn-ghost, …).

Next steps ​

Read Quick start to add the theme to a project, then explore Colors, Iconography, and Buttons.