Skip to content

feat(theme): add vscode-modern and vscode-2026 themes#79

Open
brycewc wants to merge 3 commits into
YYsuni:mainfrom
brycewc:new-vscode-themes
Open

feat(theme): add vscode-modern and vscode-2026 themes#79
brycewc wants to merge 3 commits into
YYsuni:mainfrom
brycewc:new-vscode-themes

Conversation

@brycewc

@brycewc brycewc commented Jul 17, 2026

Copy link
Copy Markdown

Summary

Adds two new VS Code themes, both following the same single-paired-theme pattern as the existing vscode theme (light mode uses the light palette, dark mode uses the dark palette):

  • vscode-modern — matches VS Code's official Dark Modern and Light Modern themes (the current VS Code defaults).
  • vscode-2026 — a newer VS Code default palette.

Colors

Base text comes from each theme's editor.foreground; token colors are the syntax colors those themes inherit.

vscode-modern

Token Light Dark
base text #3b3b3b #cccccc
property (key) #0451a5 #9cdcfe
number / index #098658 #b5cea8
string #a31515 #ce9178
boolean / null #0000ff #569cd6

vscode-2026

Token Light Dark
base text #1f2328 #c9d1d9
property (key) #116329 #7ee787
number / index #0550ae #79c0ff
string #0a3069 #a5d6ff
boolean / null #0550ae #79c0ff

Changes

  • src/style.css / src/dark.css — light and dark palettes for .json-view_vscode-modern and .json-view_vscode-2026
  • src/components/json-view.tsx — added 'vscode-modern' and 'vscode-2026' to the theme union
  • src/stories/share.ts — Storybook control options
  • src/stories/theme.stories.tsxVscode_Modern / Vscode_Modern_Dark and Vscode_2026 / Vscode_2026_Dark stories
  • website/src/contents/themes.tsx — theme list + preview background colors
  • README.md — documented the new options

Each new theme is placed directly after vscode in every list (vscodevscode-modernvscode-2026).

@vercel

vercel Bot commented Jul 17, 2026

Copy link
Copy Markdown

@brycewc is attempting to deploy a commit to the Suni's projects Team on Vercel.

A member of the Team first needs to authorize it.

@YYsuni

YYsuni commented Jul 22, 2026

Copy link
Copy Markdown
Owner

@brycewc Can you see that?
image

@vercel

vercel Bot commented Jul 22, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
json-view Ready Ready Preview, Comment Jul 22, 2026 1:32am

@brycewc

brycewc commented Jul 22, 2026

Copy link
Copy Markdown
Author

@YYsuni , I cannot see those review messages you screenshotted. I removed the pinned package manager from package.json, didn't mean to have that in there. Thanks for the quick response!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants