Skill

/create-theme

Build or refine press/theme/. Intakes brand identity and content type, picks a base preset, writes tokens.css + base/ + page-surfaces/, then hands back a workbench session for visual verification.

Command Impl

# /create-theme

Theme scaffolding workflow. Only touches press/theme/. Never changes content, components, or page geometry.

/create-theme

Lives at skills/openpress-create-theme/. Follows the theme directory contract — output is a fully populated press/theme/ that the user can edit further; the skill never hand-codes one-off visuals.

Workflow

  1. Workspace preflight — verify press/index.tsx + press/theme/ exist. If not, route to /create-press first.
  2. Intake — one batch:
    • Brand colors (primary ink + accent, hex)
    • Fonts (body, optional display; Google Fonts name / family stack / "system default")
    • Content type (long-form / brief / academic) — selects the base preset
    • Optional visual reference (URL or description)
  3. Base preset — pick the closest starter theme (see table below).
  4. Generate — write tokens.css, the required base/ files, copy stub page-surfaces/, and conditionally include patterns/ when content type is long-form.
  5. Verify — start npm run dev; ask the user to confirm cover colors, body legibility, and font fallback in the workbench.
  6. Handoff report — base preset used, token values written, which optional folders were created, next paths the user can edit (tokens.css, base/typography.css), next skill (openpress-design) for advanced layout.

Base preset map

Name Type Default Description
long-form starter A4 report / book / paper — base from a long-form domain skill (typically editorial-monograph if installed).
brief starter Memo / proposal / brief — base from claude-document or equivalent.
academic starter Paper / conference article — base from academic-paper.

What it generates

Required floor
press/theme/
├── tokens.css              ← brand colors / fonts / spacing / type scale
├── fonts.css               ← @font-face when webfonts are used; empty otherwise
└── base/
    ├── page-contract.css   ← @page + page surface; reads --openpress-page-* vars
    ├── typography.css      ← h1…p inside MdxArea
    └── print.css           ← @media print
Optional, only when content asks for it
press/theme/
├── page-surfaces/          ← cover.css / toc.css / back-cover.css (stubs)
├── shell/                  ← reader-controls.css overrides
└── patterns/               ← figure-grid / chart-frame / table-utilities
                              (long-form + academic only; slide / social skip)

Boundary

  • Edits only files under press/theme/.
  • Never sets page dimensions in CSS — that's <Press page> and engine-injected --openpress-page-* variables.
  • Never touches press/components/ or press/chapters/.
  • Never deletes an existing theme without explicit confirmation; backs up to press/theme.bak/ on reset.
  • Routes to openpress-design for layout work beyond cover / toc / patterns.

Source