Tokens, building blocks, voice.
The open reference for Struqo's visual system, from tokens to whole pages. Every value comes live from the code, Figma follows it. Agents read the same building blocks in apps/web/components/styleguide/catalog.ts.
Templates
The skeleton of a page: which organisms sit where, without content. Every area in the schema jumps to its building block.
Editor: header bar on top, tools and sheets on the left, canvas in the middle, properties on the right, footer bar below.
Composed of: TopBar, LeftRail, DrawingsRail, CanvasViewport, RightSidebar, StatusBar
App pages outside the editor: header and content.
Composed of: AppShellHeader
Public pages: navigation, content, footer.
Composed of: MarketingNav, MarketingFooter
Sign in and sign up: logo above a narrow form.
Composed of: Logo
Plan sheet: drawing on the sheet, title block bottom right.
Composed of: PrintTitleBlock