Skip to content
JSON Resume
Sign inSign upDashboard

Theme development

A theme is one function

It takes a resume and returns HTML. Publish it as jsonresume-theme-{name} and the CLI and the registry can render any resume with it.

index.js
// index.js of jsonresume-theme-yourname
export const render = (resume) => `<!doctype html>
<html>
  <head><style>body { font-family: system-ui; }</style></head>
  <body>
    <h1>${resume.basics?.name ?? ''}</h1>
    <p>${resume.basics?.label ?? ''}</p>
  </body>
</html>`;

Build

From empty folder to npm

  1. Name the package

    Create an npm package called jsonresume-theme-{name}. The name is how tools find it.
    mkdir jsonresume-theme-yourname && cd jsonresume-theme-yourname
npm init -y

  2. Export render

    Export a function render(resume) that returns a string, usually a complete HTML document.

  3. Preview it

    Run the CLI against your folder; it reloads as you edit.
    resume serve --theme .

  4. Publish

    Publish to npm. People install it next to the CLI and export with --theme yourname.
    npm publish

Learn from these

Start hereReference themeA maintained, minimal theme in this repository to copy from.In this repoStack OverflowA complete theme with every section, maintained alongside the schema.CommunityCaffeineA popular community theme with its own build.CommunityActualA clean, well-structured community theme.

Rules

What every theme does

So it works in the CLI, on the registry and anywhere else themes run.

  • Return a stringrender takes the resume object and returns HTML.
  • Stay pureNo disk or network access, so no fs or http, and nothing that imports them.
  • Inline everythingCSS and assets go in the output; images as base64 data URLs.
  • Handle missing fieldsEvery schema field is optional; render sparse resumes without errors.
  • Build however you likeTemplates, React, plain strings: the theme owns its build.

Then add it to the gallery

Browse the themesCLI reference