MangaModeEight VS Code and Cursor themes drawn from manga palettes and tuned for long sessions. Soft backgrounds, three-tone brackets, and every text color passes WCAG AA.
Hour six of the refactor.
chapter.tsMangaMode: One Piece
// Personality, under control.import { defineTheme } from "mangamode";type Volume = { name: string; issue: number };export function readChapter(vol: Volume, page = 1) { const panels = vol.issue * 24; return format(vol.name, [page, panels]);}defineTheme({ glare: "low", focus: "high" });Free on both marketplaces, installed 903 times so far.
Why it's calmer
// Personality, under control.import { defineTheme } from "mangamode";type Volume = { name: string; issue: number };export function readChapter(vol: Volume, page = 1) { const panels = vol.issue * 24; return format(vol.name, [page, panels]);}defineTheme({ glare: "low", focus: "high" });- The background is #0B1B24, not pure black. Text reads at 14.2:1 instead of a glaring 21:1.
- Nested brackets on lines 6 to 9 use three shades of one hue, not a rainbow.
- Even the quietest color, line number, still reads at 4.6:1.
Every color, measured
Ratios for One Piece against its editor background. Pick another volume from the shelf and the table follows. The same check runs on every release, so a color that fails never ships.
| Token | Sample | Color | Contrast | WCAG level |
|---|---|---|---|---|
| Text | #DCEAF1 | 14.2:1 | AAA | |
| Comment | #6E8EAE | 5.1:1 | AA | |
| Keyword | #D95E63 | 4.7:1 | AA | |
| Function | #63C8BC | 8.7:1 | AAA | |
| String | #8BD5B2 | 10.2:1 | AAA | |
| Number | #EDC372 | 10.5:1 | AAA | |
| Type | #97DCD4 | 11.2:1 | AAA | |
| Line number | #658895 | 4.6:1 | AA |
To be continued in your editor
code --install-extension markonikolajevic.mangamodeMIT licensed. Read the source on GitHub.