Live: brand.forgespace.co
Sync across repos: Repository Branding checklist — README header template, per-repo checklist, Stitch + brand tokens.
- Logo — 3-tier notch anvil (Flame Rise) with 7 variants: wordmark, monogram, icon, abstract, + 3 tint wordmarks
- Colors — Forge Purple (#7C3AED), Forge Blue (#3B82F6), Forge Amber (#F59E0B), neutrals, semantic (WCAG validated)
- Typography — Sora / DM Sans / IBM Plex Mono with major-third type scale (sub-brand stacks for Siza and MCP-Gateway)
- Design Tokens — CSS, JSON (W3C), Tailwind, Sass, React theme exports
- Spacing, Shadows, Borders, Motion, Gradients — Full token coverage
| Product | Status | Mark |
|---|---|---|
| Siza | Active | TBD (inherits Forge Space tokens) |
The /siza/ pairing examples are responsive by design: the Forge Space + Siza lockups
wrap safely on narrow viewports instead of relying on single-line desktop spacing.
Install the brand identity as an npm package for programmatic access in other projects:
npm install @forgespace/brand-guideimport { identity } from '@forgespace/brand-guide';
import type { BrandIdentity } from '@forgespace/brand-guide';
console.log(identity.name); // "Forge Space"
console.log(identity.colors.primary.hex); // "#7c3aed"Raw JSON import:
import identity from '@forgespace/brand-guide/identity';This repo doubles as a reusable brand guide template. See TEMPLATE.md for instructions on creating your own brand guide.
npm install
npm run devTo regenerate brand assets (logos, identity, tokens): ensure src/fonts/sora.woff2 (Sora) and src/fonts/dm-sans.woff2 (DM Sans) exist—both available from Google Fonts—then run npm run generate and npm run export:raster. OG images embed both fonts when present.
Security maintenance note: this project uses npm overrides to pin vulnerable transitive
dependencies (for example lodash pulled by yaml-language-server) until upstream packages
publish patched ranges.
Download tokens in your preferred format from the live site, or find them in public/downloads/:
| Format | File |
|---|---|
| CSS Custom Properties | tokens.css |
| Siza Sub-brand CSS | siza-tokens.css |
| W3C Design Tokens | tokens.json |
| Tailwind Preset | tailwind-preset.js |
| Sass Variables | tokens.scss |
| React Theme | theme.ts |
- Astro — Static site generator
- Tailwind CSS v4 — Utility-first CSS
- @forgespace/branding-mcp — Brand identity generation
MIT