Jin Code Themes - Zen Collection

Name: Jin Code Themes - Zen Collection
Author: Jijin

Publisher: JijinThemes in package: 5

Thoughtfully crafted minimal light and dark theme for peaceful, distraction-free coding

Open in VS Code GitHub

Color themes

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

Jin Code Themes - Zen Collection — J charcoal

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

Problems1

Output

Debug Console

Terminal

Ports

~/my-project $ pnpm dev
▲ Next.js ready on http://localhost:3000
✓ compiled client and server successfully in 412ms
wait - compiling /theme/vscode...
~/my-project

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBorder#FFCC66
activityBar.background#1A1E2A
activityBar.border#191E2A
activityBar.foreground#CBCCC6
activityBar.inactiveForeground#707A8C
activityBarBadge.background#FFCC66
activityBarBadge.foreground#1F2430
button.background#FFCC66
button.foreground#1F2430
button.hoverBackground#ffd580
editor.background#1F2430
editor.findMatchBackground#0000
editor.findMatchBorder#FF9944
editor.findMatchHighlightBackground#0000
editor.findMatchHighlightBorder#ffcc66ae
editor.foreground#CBCCC6
editor.inactiveSelectionBackground#3d516a
editor.lineHighlightBackground#191E2A
editor.selectionBackground#3d516a
input.background#171C24
input.border#0000
input.foreground#CBCCC6
input.placeholderForeground#707A8C
sideBar.background#1A1E2A
sideBar.border#191e2a
sideBar.foreground#8A91A6
sideBarSectionHeader.background#1F2430
sideBarSectionHeader.border#191E2A95
sideBarSectionHeader.foreground#8A91A6
sideBarTitle.foreground#CBCCC6
statusBar.background#1A1E2A
statusBar.border#191e2a
statusBar.debuggingBackground#89D185
statusBar.debuggingForeground#1F2430
statusBar.foreground#8A91A6
statusBar.noFolderBackground#1A1E2A
statusBarItem.remoteBackground#FFCC66
statusBarItem.remoteForeground#1F2430
tab.activeBackground#171C24
tab.activeBorderTop#FFCC66
tab.activeForeground#CBCCC6
tab.hoverBackground#191E2A
tab.hoverForeground#CBCCC6
tab.inactiveBackground#1F2430
tab.inactiveForeground#707A8C
terminal.ansiBlack#191e2a
terminal.ansiBlue#6dcbfa
terminal.ansiBrightBlack#686868
terminal.ansiBrightBlue#73d0ff
terminal.ansiBrightCyan#95e6cb
terminal.ansiBrightGreen#bae67e
terminal.ansiBrightMagenta#F29E74
terminal.ansiBrightRed#f28779
terminal.ansiBrightWhite#FFFFFF
terminal.ansiBrightYellow#ffd580
terminal.ansiCyan#90e1c6
terminal.ansiGreen#a6cc70
terminal.ansiMagenta#FF9944
terminal.ansiRed#ed8274
terminal.ansiWhite#c7c7c7
terminal.ansiYellow#fad07b
terminal.background#1A1E2A
terminal.foreground#CBCCC6
terminalCursor.background#232834
terminalCursor.foreground#ffcc66

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
meta.object-literal.key, meta.object.member, meta.objectliteral meta.object.member, meta.var.expr meta.object-literal.key, variable.object.property, support.variable.property, variable.other.property, variable.other.object.property	#FF9944	—
string, string.quoted, string.quoted.single, string.quoted.double, string.template	#BAE67E	—
support.type.property-name.json, meta.structure.dictionary.json support.type.property-name.json	#FF9944	—
comment	#5c6773	italic
entity.name.function	#FFD580	bold
keyword	#FF9944
variable.language.this, variable.language.super	#5CCFE6	italic
constant.numeric	#73d0ff
support.class.console, support.function.console	#F27983