Patterns

Worked examples of how brio's components compose into common application shapes -- auth forms, settings panels, search forms, checkout flows, app layouts, empty states. Each pattern uses real brio CSS (with minimal demo CSS where genuinely needed) and shows the markup end-to-end so you can copy the shape and adapt the content.

Patterns are demo-led. Reference pages explain; pattern pages show. The prose here is minimal on purpose; if a pattern needs a paragraph of setup before the demo makes sense, that usually means the underlying component reference page is the better place to teach the idea.

These aren't the only way to build the shapes they show -- just one composed end-to-end. Treat them as starting points and adapt to the project at hand.