Theme Creator

Editor

All values are saved in the exported JSON.

Metadata

Theme name

Author

License

Supported modes

Light Dark

Description

Shiki theme — light

Shiki theme — dark

Core Colors

Surface colors cards, sidebars, fields, popovers

Switch mode without changing editor tab.

Theme preview session

Simulated app interface

Ask to Edit✓ Source OK

Assistant
Here is how your colors feel in a real conversation card. Foreground, paper, and popover surfaces all work together here.

Links use the accent color: Open generated theme file

Looks great — can you execute the export?

Tool result
Your accent color is used for primary actions and selected navigation states.

Theme validation

JSON schema-ready✓ Passed

Syntax previewgithub-light

// Shiki theme controls code block colors
export function createTheme(mode) {
  const accent = "#8b5cf6";
  return { mode, accent, steps: 3 };
}

Message assistant…