← Back to Blog
Product Update

Introducing the Theme Store: Custom Themes for Every Writer

The Mark.build Theme Store is live. Explore hand-crafted themes, build your own in Theme Studio, and publish beautifully formatted articles.


When we launched Mark.build, we made a bet: writers shouldn’t have to choose between a clean writing experience and a beautiful published result. We proved the concept — write in Markdown, export to pixel-perfect HTML, switch themes instantly. Today’s update takes that further.

What’s new

Theme Store

The Theme Store ships with hand-crafted themes spanning technical blogs, academic papers, magazines, and minimalist writing. Every theme defines both light and dark modes and passes WCAG AA contrast checks automatically.

Themes are built on our Design Token system — three layers of tokens (Primitive → Semantic → Component) that wire every rendered element — headings, code blocks, Mermaid diagrams, KaTeX formulas, tables, blockquotes — to a single coherent palette. Switch themes and everything updates at once, including the CodeMirror editor itself.

Theme Studio

Power users can now open Theme Studio at /theme-studio and design their own theme from scratch. The three-column layout gives you a token editor on the left, a live Markdown preview in the center, and a WCAG contrast report on the right. Every change is reflected instantly — no build step, no reload.

When you’re happy with the result, copy the CSS variable block or export it as a file.

Editor improvements

  • Find & Replace — press Ctrl+H (or ⌘H) to open the search panel directly inside the editor. Supports regex, case sensitivity, and whole-word matching.
  • Document outline — a collapsible TOC panel parses your headings in real time and lets you jump to any section with a click.
  • Drag-and-drop import — drop a .md, .docx, .pdf, or .html file onto the editor to import it instantly.
  • Paste as plain textCtrl+Shift+V strips rich-text formatting before inserting clipboard content.
  • Clear formatting — the new toolbar button removes bold, italic, strikethrough, and inline code from selected text in one click.
  • Auto-save status — the status bar now shows “Saving…” and “Saved” so you always know where your document stands.

Export improvements

  • Mermaid diagrams in HTML export — exported HTML files now include rendered SVGs instead of placeholder divs. No JavaScript required in the output file.
  • Image export presets — the image export dialog now shows a selection step before triggering the render. Choose from WeChat long image, OG cover, square, or Xiaohongshu portrait presets.

Document management

  • Double-click any document title in the sidebar to rename it inline.
  • A search bar at the top of the sidebar filters documents by name as you type.
  • Reading-time estimate and word count appear in the status bar.

The Design Token system — why it matters

Most Markdown editors treat theming as a stylesheet swap. We treat it as a type system. Every visual property — a heading color, a code block border radius, a Mermaid node background — is a named token. Themes declare values for those tokens; components consume them. The result is a theme that can’t accidentally leave one element unstyled.

The same token set compiles to different targets depending on where it’s used: CSS custom properties for the live editor, inlined style attributes for clipboard export (so WeChat and email clients see the right colors), and themeVariables for Mermaid.

What’s next

Coming soon: a Tauri desktop app for macOS — local file management, offline-first, and a sub-10 MB install. WYSIWYG editing and one-click WeChat publishing are also on the roadmap.

Thank you for being an early user.


Try the editor → · Open Theme Studio → · Browse themes →