Skip to main content

Custom themes

Apply a brand through frontmatter and a scoped override stylesheet while keeping the framework's semantic role/surface tokens intact.

Frontmatter​

theme:
  source: "./company-template.pptx"
  footer: "Example team"
  pagination: true
  logo: auto

The source can be a PPTX or a previously extracted theme directory. The builder recognizes PDF paths but its PDF extraction path currently reports that extraction is unimplemented.

CSS customization​

Use --pptx-* for brand colors, then style titles, cards, buttons, code, logo placement, and responsive layout with semantic tokens. Keep selectors scoped to the deck or intentional preset so one theme does not leak into another.

:root { --pptx-accent1: #2563eb; }
.slide-deck .review-note {
  color: var(--on-surface-muted);
  background: var(--surface-2);
}

Motion and responsiveness​

Customize supported transitions and fragment classes without hiding essential content. Use the deck's scaling/layout model and test small viewports, text wrapping, contrast, and logo/footer placement. Avoid fixed dark text/background overrides that defeat the light/dark token scopes.

Apply and check​

Load base framework styles, extracted brand input, and intentional project overrides in the generated order. Inspect computed styles and the actual light/dark render when an override behaves unexpectedly. Validate and review before publication.