Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

[Feat]: Tokyo Night theme package (Day and Night)

Open
  • Is something wrong?
#862 0 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
4/5
Estimated time
3-5 days
Newbie friendliness
55/100
Issue type
Feature
Clarity
Clearly specified
Activity status
Active
Tech stack
json
Domain
design, frontend

Research direction

Start with packages/create-plugin/THEMES.md and src/schemas/theme-definition-v1.json, then scaffold the external package with the command in the issue. Fill themes/light.json and themes/dark.json using the Tokyo Night palette, and check contrast against DESIGN.md. Done means validation passes, the ZIP installs and both variants are shown across the requested app areas, with a release submitted to the registry.

Written by the indexing model from the issue text.

Description

feature request good first issue
🚀 Feature Proposal

Create a Tokyo Night theme package for Tabularis, with two variants:

  • Tokyo Night Day (light)
  • Tokyo Night (dark)

Palette reference: https://github.com/folke/tokyonight.nvim (see extras/ for the color values).

The theme should ship as an installable theme package in its own repository, not as a built-in preset in this repo. Theme packages are pure data (JSON), no code runs.

Where to start

Read the theme author guide: packages/create-plugin/THEMES.md.

  1. Scaffold a two-variant package with the published tooling:

    npx -p @tabularis/create-plugin tabularis-theme scaffold tabularis-tokyo-night-theme \
  --dir ./tabularis-tokyo-night-theme --min-runtime-version 0.26.0

    This creates .tabularium (the manifest), themes/light.json, themes/dark.json, an offline validator in tools/theme.mjs and ready-made GitHub workflows.

  2. Rename the variants in .tabularium ("Day" and "Night") and fill the two definitions. The allowed fields (application colors and Monaco editor colors / SQL token rules) are defined in src/schemas/theme-definition-v1.json. Missing values fall back to the host defaults, so you can start small.

  3. Validate and package:

    node tools/theme.mjs validate .
node tools/theme.mjs package . --output theme-universal.zip

  4. Try it in the app: Settings → Appearance → Manage themes → Local package, pick the ZIP, preview both variants, install, then select a variant.

  5. Publish a release and submit the repository to the registry (section 6 of the guide).

Aim for readable contrast: built-in themes meet WCAG 2.2 AA on the token pairs listed in the Contrast section of DESIGN.md. When a palette color fails, nudge it slightly rather than ignoring it.

Acceptance criteria
  • A public repository with the package, a real license (replace the UNLICENSED placeholder) and credit to the original palette authors.
  • node tools/theme.mjs validate . passes and the generated ZIP installs through Local package.
  • Both variants look right across the SQL editor, data grid, sidebar and modals (screenshots in the README).
  • A tagged GitHub release with theme-universal.zip, submitted to the registry.
  • Comment here with the repository link so we can review it and list it.
Contributor notes
  • Respect the upstream palette license and attribution before redistributing.
  • Questions? Ask here or on Discord.
Dominant language
TypeScript
Stars
5.1k
Forks
335
Avg merge
2d 5h
Merged PRs (30d)
60

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from TabularisDB/tabularis

All issues in TabularisDB/tabularis

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.