Alpha: Ships on npm at 7.0.0-alpha.07.0.0-alpha.0
Brand and Theme
startupbuilder.dev defines the Brand and the Theme; mdxui draws a Theme as a Brand's tokens plus its render policies, named in one field.
A Brand is a name, a voice, a logo, and a style under which a Startup makes Offers.Brand startupbuilder.dev
A Theme is the design tokens of a Brand, its color, type, spacing, radius, and motion, that every Component reads when it renders.Theme startupbuilder.dev
mdxui draws a Theme as the Brand's tokens plus its render policies. A policy is a choice a design makes once, such as what falls between two sections. A Page names its Theme in one field, theme.
What mdxui renders
One record, Harbor's home page, under each of the five bundled Themes. Only the theme field differs.
| Theme | Typefaces | dividers | markers | featured | icons | scheme |
|---|---|---|---|---|---|---|
| certificate | IBM Plex Sans · IBM Plex Mono | hatch | on | rule | inline | auto |
| vaultline | Newsreader · Public Sans · IBM Plex Mono | rule | off | plate | image | auto |
| quaypoint | Space Grotesk · Inter · JetBrains Mono | rule | off | plate | inline | light |
| callboard | Bricolage Grotesque · Instrument Sans · DM Mono | rule | off | plate | inline | light |
| directory | Inter · JetBrains Mono | none | off | rule | inline | auto |
How it maps
| startupbuilder.dev | mdxui today | Status |
|---|---|---|
Brand name | navfooterbrand.text in the nav and footer sections, with an optional accent suffix | Alpha: Renders today from the published packages |
Brand voice | No field: the agent writes in the voice, and the bounds keep it short | Gap: No counterpart in the record; the intended Noun drafts one |
Brand logo | brand.mark, a glyph from Icons; no logo file | Gap: No counterpart in the record; the intended Noun drafts one |
Brand style | The Theme the record names | Alpha: Renders today from the published packages |
Theme tokens | Roles: 21 every Theme sets, the rest derived with defaults | Alpha: Renders today from the published packages |
light and dark modes | A dark palette, and the scheme policy that decides whether a page follows the reader | Alpha: Renders today from the published packages |
Theme css | None, by design: no page carries its own CSS | Gap: No counterpart in the record; the intended Noun drafts one |
every Component reads it | Every Section type reads roles, never a literal color | Alpha: Renders today from the published packages |
Status
The five Themes and compileTheme, which turns your own tokens and policies into a Theme, ship in @mdxui/themes@7.0.0-alpha.0. The Brand's voice and logo have no field: the Site record drafts the logo.