Ship the Dracula syntax palette as an integrated refrakt preset, following the pattern established by WORK-220 (Nord). Dark-canonical, no official light variant — ships as dark-only via modes.dark; light mode (when a user is on a light-mode site and the Dracula tint is applied) inherits the surrounding chrome.
Tracking started Oct 9 — check back for trends.
packages/lumina/src/presets/dracula.ts exports a ThemeTokensConfig overriding chrome accents (color.bg/surface.base/text/muted/border/primary), color.code.*, and syntax.* for dark mode only./presets/dracula in packages/lumina/package.json#ff79c6), function (Green #50fa7b), type (Cyan #8be9fd), string (Yellow #f1fa8c), constant (Purple #bd93f9), comment (Grey #6272a4), variable (Foreground #f8f8f2)type ≠ function, tag, attribute — proving the fidelity gain over a 9-role mapping// Pink)packages/lumina/test/dracula-preset.test.ts mirrors nord-preset.test.ts — structural shape, role splits, code-surface canvas, CSS generation, composition with tideline / niwaki / Luminasite/content/themes/dracula.md follows the Nord doc page structure: intro + opt-in + palette (dark-only) + live preview (shared TS+JSX snippet) + composing with tideline + attributionDark-only palette — ship modes.dark populated and leave the base level mostly empty (chrome accents fall through to whatever theme/preset sits beneath). When opted in as the active preset, Dracula effectively forces dark rendering since light mode has no Dracula values; document this explicitly in the file header.
For the palette doc page, both {% palette %} blocks can render the dark palette — there's no light variant to show. Use a single "Dracula — the palette" block instead of two light/dark blocks, or render the same dark palette twice with the same swatches.
Verify the role splits with the comprehensive TS+JSX snippet from the Nord page — User should read Cyan (type), findUser should read Green (function), <Button> should read Pink-or-Cyan depending on Dracula's intent for JSX tags.
Completed: 2026-05-20
Branch: claude/spec-057-v0-14-2-implementation
packages/lumina/src/presets/dracula.ts — Dracula as a dark-only ThemeTokensConfig. All chrome accents + code-surface + syntax (11 base roles + 5 extended) populated via modes.dark. Each hue annotated with its Dracula swatch name (Pink, Cyan, Green, Yellow, Purple, Red, Orange, Foreground, Current Line, Comment, Background) for traceability.packages/lumina/package.json — added ./presets/dracula export entry.packages/lumina/test/dracula-preset.test.ts — 11 tests covering structural shape (dark-only invariant), role splits (type ≠ function, regex ≠ string), CSS generation (chrome + code-surface + syntax all in the dark block; no light block), and composition with tideline / niwaki / Lumina.site/content/themes/dracula.md — doc page following the Nord pattern. Single palette block with tint-mode="dark" (no light variant). Live preview wraps the shared TS+JSX snippet in {% codegroup tint="dracula" %}.refrakt.config.json — added sites.main.tints.dracula so the doc page can use tint="dracula".site/content/themes/_layout.md — Dracula listed in the Syntax presets group.Dracula sets 5 of the 7 SPEC-056 extended optional roles distinctly: type (Cyan), number (Purple, same as constant — same hue, intentional collapse), regex (Red, distinct from string Yellow), tag (Pink — same as keyword, intentional), attribute (Green — same as function, intentional), operator (Pink). parameter and property left unset (Dracula doesn't separately spec them). The Cyan/Green split between type and function is the SPEC-056 headline fidelity gain over a 9-role mapping.
npx vitest run packages/lumina/test/dracula-preset.test.ts — 11/11 pass.npm test — 2547/2547 pass across 207 test files.data-tint="dracula" stamps on the doc page; [data-tint=dracula][data-color-scheme=dark] rule in the CSS bundle.packages/lumina/src/presets/dracula.ts (new)packages/lumina/package.json (added export entry)packages/lumina/test/dracula-preset.test.ts (new, 11 tests)site/content/themes/dracula.md (new)site/content/themes/_layout.md (Dracula in nav)refrakt.config.json (Dracula in site tints)