Naruto Shinobi Theme

Name: Naruto Shinobi Theme
Author: Kushal Raj G S

Publisher: Kushal Raj G SThemes in package: 25

Believe it! A vibrant VS Code theme inspired by Naruto Uzumaki and the ninja world. Features iconic orange, blue, and dark colors from the beloved anime.

Open in VS Code GitHub

Color themes

VS Code preview

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

Naruto Shinobi Theme — Naruto Sasuke Uchiha - Sharingan

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
export interface User {
  id: string;
  name: string;
  role: "admin" | "member";
  tags: string[];
}

/**
 * Fetch user data by ID
 * @param id
 * @returns User object or null if ID is invalid
 */
export async function fetchUser(id: string): Promise<User | null> {
  if (!id) {
    return null;
  }

  const response = await fetch(`/api/users/${id}`, {
    method: "GET",
    headers: { Accept: "application/json" },
  });

  if (!response.ok) {
    throw new Error(`HTTP ${response.status}`);
  }

  return (await response.json()) as User;
}

function greet(user: User): string {
  // Simple greeting function that uses the user's name
  return `Hello, ${user.name}!`;
}

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.activeBackground#1a0a0a
activityBar.activeBorder#FF0000
activityBar.background#000000
activityBar.border#2a0a0a
activityBar.foreground#FF0000
activityBar.inactiveForeground#5a3a3a
activityBarBadge.background#CC0000
activityBarBadge.foreground#ffffff
badge.background#FF0066
badge.foreground#ffffff
breadcrumb.activeSelectionForeground#9370DB
breadcrumb.focusForeground#FF0066
breadcrumb.foreground#7a7a9a
button.background#8b00ff
button.foreground#ffffff
button.hoverBackground#9370DB
button.secondaryBackground#3a3a5a
button.secondaryForeground#ffffff
button.secondaryHoverBackground#4a4a6a
debugExceptionWidget.background#1a0000
debugExceptionWidget.border#FF0066
debugToolBar.background#1a1a2e
debugToolBar.border#8b00ff
diffEditor.border#2a2a3e
diffEditor.insertedTextBackground#4169E120
diffEditor.removedTextBackground#FF006620
dropdown.background#1a1a2e
dropdown.border#8b00ff
dropdown.foreground#ffffff
editor.background#0a0000
editor.findMatchBackground#FF000080
editor.findMatchHighlightBackground#FF000040
editor.foreground#e8e8e8
editor.inactiveSelectionBackground#CC000030
editor.lineHighlightBackground#1a0a0a
editor.selectionBackground#CC000060
editor.selectionHighlightBackground#CC000025
editor.wordHighlightBackground#80000030
editor.wordHighlightStrongBackground#80000050
editorBracketMatch.background#8b00ff40
editorBracketMatch.border#9370DB
editorCursor.foreground#FF0000
editorError.background#1a000080
editorError.border#000000
editorError.foreground#1a0000
editorGroupHeader.tabsBackground#0a0a14
editorGroupHeader.tabsBorder#2a2a3e
editorHint.foreground#9370DB
editorIndentGuide.activeBackground1#8b00ff
editorIndentGuide.background1#2a2a3e
editorInfo.foreground#4169E1
editorLineNumber.activeForeground#FF0066
editorLineNumber.foreground#5a5a7a
editorSuggestWidget.background#1a1a2e
editorSuggestWidget.border#8b00ff
editorSuggestWidget.foreground#e8e8f0
editorSuggestWidget.highlightForeground#FF0066
editorSuggestWidget.selectedBackground#8b00ff40
editorWarning.foreground#FFD700
editorWhitespace.foreground#2a2a3e
editorWidget.background#1a1a2e
editorWidget.border#8b00ff
editorWidget.foreground#e8e8f0
focusBorder#FF0066
gitDecoration.conflictingResourceForeground#ff0000
gitDecoration.deletedResourceForeground#FF0066
gitDecoration.ignoredResourceForeground#5a5a7a
gitDecoration.modifiedResourceForeground#4169E1
gitDecoration.untrackedResourceForeground#8b00ff
input.background#1a1a2e
input.border#8b00ff
input.foreground#ffffff
input.placeholderForeground#5a5a7a
inputOption.activeBorder#FF0066
inputValidation.errorBackground#1a0000
inputValidation.errorBorder#000000
inputValidation.warningBackground#3a2a00
inputValidation.warningBorder#FFD700
list.activeSelectionBackground#8b00ff60
list.activeSelectionForeground#ffffff
list.errorForeground#ff6b8a
list.focusBackground#8b00ff60
list.focusForeground#ffffff
list.highlightForeground#FF0066
list.hoverBackground#2a2a4a
list.hoverForeground#ffffff
list.inactiveSelectionBackground#3a3a5a
list.inactiveSelectionForeground#ffffff
list.warningForeground#FFD700
merge.border#FF0066
merge.currentContentBackground#4169E120
merge.currentHeaderBackground#4169E150
merge.incomingContentBackground#8b00ff20
merge.incomingHeaderBackground#8b00ff50
notificationCenter.border#2a2a3e
notificationCenterHeader.background#1a1a2e
notificationLink.foreground#9370DB
notifications.background#1a1a2e
notifications.border#8b00ff
notifications.foreground#ffffff
panel.background#0a0a14
panel.border#2a2a3e
panelTitle.activeBorder#8b00ff
panelTitle.activeForeground#ffffff
panelTitle.inactiveForeground#7a7a9a
peekView.border#8b00ff
peekViewEditor.background#1a1a2e
peekViewEditor.matchHighlightBackground#8b00ff40
peekViewResult.background#0f0f1a
peekViewResult.matchHighlightBackground#8b00ff40
peekViewResult.selectionBackground#8b00ff60
peekViewTitle.background#1a1a2e
peekViewTitleDescription.foreground#7a7a9a
peekViewTitleLabel.foreground#9370DB
scrollbarSlider.activeBackground#9370DB80
scrollbarSlider.background#8b00ff40
scrollbarSlider.hoverBackground#8b00ff60
sideBar.background#0f0000
sideBar.border#2a0a0a
sideBar.foreground#c8c8c8
sideBarSectionHeader.background#1a0a0a
sideBarSectionHeader.border#2a0a0a
sideBarSectionHeader.foreground#FF0000
sideBarTitle.foreground#CC0000
statusBar.background#000000
statusBar.border#2a0a0a
statusBar.debuggingBackground#CC0000
statusBar.debuggingForeground#ffffff
statusBar.foreground#FF0000
statusBar.noFolderBackground#2a0a0a
statusBarItem.errorBackground#800000
statusBarItem.errorForeground#ffffff
statusBarItem.prominentBackground#CC0000
statusBarItem.prominentHoverBackground#FF0000
statusBarItem.warningBackground#FFD700
statusBarItem.warningForeground#000000
tab.activeBackground#1a1a2e
tab.activeBorder#0a0a14
tab.activeBorderTop#8b00ff
tab.activeForeground#ffffff
tab.border#1a1a1a
tab.hoverBackground#1a1a2e
tab.hoverBorder#9370DB
tab.hoverForeground#ffffff
tab.inactiveBackground#0f0f1a
tab.inactiveForeground#7a7a9a
terminal.ansiBlack#1a1a1a
terminal.ansiBlue#4169E1
terminal.ansiBrightBlack#3a3a5a
terminal.ansiBrightBlue#5a8aff
terminal.ansiBrightCyan#00ffff
terminal.ansiBrightGreen#9a9aba
terminal.ansiBrightMagenta#9370DB
terminal.ansiBrightRed#ff3388
terminal.ansiBrightWhite#ffffff
terminal.ansiBrightYellow#ffea00
terminal.ansiCyan#00CED1
terminal.ansiGreen#7a7a9a
terminal.ansiMagenta#8b00ff
terminal.ansiRed#FF0066
terminal.ansiWhite#e8e8f0
terminal.ansiYellow#FFD700
terminal.background#0a0a14
terminal.foreground#e8e8f0
terminalCursor.foreground#FF0066
titleBar.activeBackground#0a0a14
titleBar.activeForeground#9370DB
titleBar.border#2a2a3e
titleBar.inactiveBackground#0a0a14
titleBar.inactiveForeground#5a5a7a

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#5a5a7a	italic
keyword, storage.type, storage.modifier	#FF0066	bold
keyword.control, keyword.operator	#8b00ff	bold
keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as	#9370DB
string, string.quoted	#4169E1	—
string.template, string.quoted.template	#5a8aff	—
constant.character.escape	#00CED1	bold
string.regexp	#9370DB	—
constant.numeric, constant.language	#FFD700	—
constant.language.boolean	#ff3388	bold
variable, variable.other	#e8e8f0	—
variable.parameter	#b8b8d8	italic
variable.other.property, support.variable.property	#c8c8dc	—
entity.name.function, support.function	#9370DB	bold
meta.function-call	#8b7ddb	—
entity.name.type, entity.name.class, support.class	#FF0066
entity.other.inherited-class	#ff3388	italic
entity.name.tag	#8b00ff	bold
entity.other.attribute-name	#9370DB	italic
entity.name.tag.css, entity.other.attribute-name.class.css	#FF0066	—
support.type.property-name.css	#4169E1	—
support.constant.property-value.css	#FFD700	—
support.type, support.class	#8b7ddb	—
support.constant	#ff3388	—
support.type.property-name.json	#9370DB	—
keyword.operator	#FF0066	—
punctuation	#8a8aaa	—
punctuation.definition.string, punctuation.definition.parameters, punctuation.definition.array	#7a7a9a	—
meta.brace, punctuation.section	#c8c8dc	—
invalid	#ffffff	—
invalid.deprecated	#5a5a7a	strikethrough
markup.heading	#FF0066	bold
markup.bold	#8b00ff	bold
markup.italic	#9370DB	italic
markup.inline.raw	#4169E1	—
markup.underline.link	#00CED1	underline
markup.list	#FFD700	—
markup.inserted	#4169E1	—
markup.deleted	#FF0066	—
markup.changed	#FFD700	—
variable.language.this	#FF0066	italic
entity.name.type.ts, entity.name.type.tsx	#ff3388	—
meta.decorator, punctuation.decorator	#8b00ff	bold
variable.language.special.self.python	#FF0066	italic
entity.name.function.decorator.python	#8b00ff	—

VS Code preview

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

Naruto Shinobi Theme — Naruto Shikamaru Nara - Shadow Strategist

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
export interface User {
  id: string;
  name: string;
  role: "admin" | "member";
  tags: string[];
}

/**
 * Fetch user data by ID
 * @param id
 * @returns User object or null if ID is invalid
 */
export async function fetchUser(id: string): Promise<User | null> {
  if (!id) {
    return null;
  }

  const response = await fetch(`/api/users/${id}`, {
    method: "GET",
    headers: { Accept: "application/json" },
  });

  if (!response.ok) {
    throw new Error(`HTTP ${response.status}`);
  }

  return (await response.json()) as User;
}

function greet(user: User): string {
  // Simple greeting function that uses the user's name
  return `Hello, ${user.name}!`;
}

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.activeBackground#1a1a1a
activityBar.activeBorder#6B8E23
activityBar.background#000000
activityBar.border#2a2a2a
activityBar.foreground#808080
activityBar.inactiveForeground#4a4a4a
activityBarBadge.background#556B2F
activityBarBadge.foreground#ffffff
badge.background#556B2F
badge.foreground#ffffff
breadcrumb.activeSelectionForeground#6B8E23
breadcrumb.focusForeground#8B9A6B
breadcrumb.foreground#7a7a7a
button.background#2F4F2F
button.foreground#d0d0d0
button.hoverBackground#556B2F
button.secondaryBackground#2a2a2a
button.secondaryForeground#d0d0d0
button.secondaryHoverBackground#3a3a3a
debugExceptionWidget.background#2a2a2a
debugExceptionWidget.border#696969
debugToolBar.background#1a1a1a
debugToolBar.border#2F4F2F
diffEditor.border#2a2a2a
diffEditor.insertedTextBackground#6B8E2330
diffEditor.removedTextBackground#69696930
dropdown.background#1a1a1a
dropdown.border#2F4F2F
dropdown.foreground#d0d0d0
editor.background#0d0d0d
editor.findMatchBackground#556B2F80
editor.findMatchHighlightBackground#556B2F50
editor.foreground#d0d0d0
editor.inactiveSelectionBackground#2a2a2a50
editor.lineHighlightBackground#1a1a1a
editor.selectionBackground#2a2a2a80
editor.selectionHighlightBackground#3a3a3a40
editor.wordHighlightBackground#4a4a4a30
editor.wordHighlightStrongBackground#4a4a4a50
editorBracketMatch.background#3a3a3a50
editorBracketMatch.border#6B8E23
editorCursor.foreground#8B9A6B
editorError.background#69696980
editorError.border#808080
editorError.foreground#696969
editorGroupHeader.tabsBackground#000000
editorGroupHeader.tabsBorder#2a2a2a
editorHint.foreground#8B9A6B
editorIndentGuide.activeBackground1#4a4a4a
editorIndentGuide.background1#2a2a2a
editorInfo.foreground#6B8E23
editorLineNumber.activeForeground#8B9A6B
editorLineNumber.foreground#5a5a5a
editorSuggestWidget.background#1a1a1a
editorSuggestWidget.border#2F4F2F
editorSuggestWidget.foreground#d0d0d0
editorSuggestWidget.highlightForeground#8B9A6B
editorSuggestWidget.selectedBackground#3a3a3a60
editorWarning.foreground#A9A9A9
editorWhitespace.foreground#2a2a2a
editorWidget.background#1a1a1a
editorWidget.border#2F4F2F
editorWidget.foreground#d0d0d0
focusBorder#6B8E23
gitDecoration.conflictingResourceForeground#556B2F
gitDecoration.deletedResourceForeground#696969
gitDecoration.ignoredResourceForeground#4a4a4a
gitDecoration.modifiedResourceForeground#6B8E23
gitDecoration.untrackedResourceForeground#8B9A6B
input.background#1a1a1a
input.border#2F4F2F
input.foreground#d0d0d0
input.placeholderForeground#5a5a5a
inputOption.activeBorder#6B8E23
inputValidation.errorBackground#2a2a2a
inputValidation.errorBorder#808080
inputValidation.warningBackground#2a2a2a
inputValidation.warningBorder#A9A9A9
list.activeSelectionBackground#3a3a3a80
list.activeSelectionForeground#ffffff
list.errorForeground#A9A9A9
list.focusBackground#3a3a3a80
list.focusForeground#ffffff
list.highlightForeground#8B9A6B
list.hoverBackground#1a1a1a
list.hoverForeground#d0d0d0
list.inactiveSelectionBackground#2a2a2a
list.inactiveSelectionForeground#d0d0d0
list.warningForeground#808080
merge.border#6B8E23
merge.currentContentBackground#2F4F2F30
merge.currentHeaderBackground#2F4F2F70
merge.incomingContentBackground#69696930
merge.incomingHeaderBackground#69696970
minimap.errorHighlight#808080
minimap.findMatchHighlight#556B2F80
minimap.selectionHighlight#3a3a3a80
minimap.warningHighlight#A9A9A9
minimapGutter.addedBackground#6B8E23
minimapGutter.deletedBackground#696969
minimapGutter.modifiedBackground#8B9A6B
notificationCenter.border#2a2a2a
notificationCenterHeader.background#1a1a1a
notificationLink.foreground#8B9A6B
notifications.background#1a1a1a
notifications.border#2F4F2F
notifications.foreground#d0d0d0
panel.background#0d0d0d
panel.border#2a2a2a
panelTitle.activeBorder#6B8E23
panelTitle.activeForeground#d0d0d0
panelTitle.inactiveForeground#7a7a7a
peekView.border#2F4F2F
peekViewEditor.background#1a1a1a
peekViewEditor.matchHighlightBackground#556B2F50
peekViewResult.background#0d0d0d
peekViewResult.matchHighlightBackground#556B2F50
peekViewResult.selectionBackground#3a3a3a80
peekViewTitle.background#1a1a1a
peekViewTitleDescription.foreground#7a7a7a
peekViewTitleLabel.foreground#8B9A6B
progressBar.background#556B2F
scrollbarSlider.activeBackground#4a4a4aA0
scrollbarSlider.background#3a3a3a60
scrollbarSlider.hoverBackground#3a3a3a80
sideBar.background#0d0d0d
sideBar.border#2a2a2a
sideBar.foreground#c0c0c0
sideBarSectionHeader.background#1a1a1a
sideBarSectionHeader.border#2a2a2a
sideBarSectionHeader.foreground#6B8E23
sideBarTitle.foreground#8B9A6B
statusBar.background#2F4F2F
statusBar.border#2a2a2a
statusBar.debuggingBackground#556B2F
statusBar.debuggingForeground#ffffff
statusBar.foreground#d0d0d0
statusBar.noFolderBackground#2a2a2a
statusBarItem.errorBackground#696969
statusBarItem.errorForeground#ffffff
statusBarItem.prominentBackground#556B2F
statusBarItem.prominentHoverBackground#6B8E23
statusBarItem.warningBackground#808080
statusBarItem.warningForeground#000000
tab.activeBackground#1a1a1a
tab.activeBorder#000000
tab.activeBorderTop#6B8E23
tab.activeForeground#d0d0d0
tab.border#0d0d0d
tab.hoverBackground#1a1a1a
tab.hoverBorder#556B2F
tab.hoverForeground#d0d0d0
tab.inactiveBackground#0d0d0d
tab.inactiveForeground#7a7a7a
terminal.ansiBlack#1a1a1a
terminal.ansiBlue#556B2F
terminal.ansiBrightBlack#4a4a4a
terminal.ansiBrightBlue#6B8E23
terminal.ansiBrightCyan#556B2F
terminal.ansiBrightGreen#9ACD32
terminal.ansiBrightMagenta#A9A9A9
terminal.ansiBrightRed#A9A9A9
terminal.ansiBrightWhite#e0e0e0
terminal.ansiBrightYellow#BDB76B
terminal.ansiCyan#2F4F2F
terminal.ansiGreen#6B8E23
terminal.ansiMagenta#808080
terminal.ansiRed#696969
terminal.ansiWhite#c0c0c0
terminal.ansiYellow#8B9A6B
terminal.background#0d0d0d
terminal.foreground#d0d0d0
terminalCursor.foreground#8B9A6B
titleBar.activeBackground#000000
titleBar.activeForeground#808080
titleBar.border#2a2a2a
titleBar.inactiveBackground#000000
titleBar.inactiveForeground#4a4a4a

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#5a5a5a	italic
keyword, storage.type, storage.modifier	#808080	bold
keyword.control, keyword.operator	#A9A9A9	bold
keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as	#6B8E23
string, string.quoted	#8B9A6B	—
string.template, string.quoted.template	#9ACD32	—
constant.character.escape	#6B8E23	bold
string.regexp	#556B2F	—
constant.numeric, constant.language	#BDB76B	bold
constant.language.boolean	#A9A9A9	bold
variable, variable.other	#3a3a3a
variable.parameter	#696969	italic
variable.other.property, support.variable.property	#808080	—
entity.name.function, support.function	#A9A9A9	bold
meta.function-call	#C0C0C0	—
entity.name.type, entity.name.class, support.class	#556B2F
entity.other.inherited-class	#6B8E23	italic
entity.name.tag	#696969	bold
entity.other.attribute-name	#808080	italic
entity.name.tag.css, entity.other.attribute-name.class.css	#696969	—
support.type.property-name.css	#808080	—
support.constant.property-value.css	#8B9A6B	—
support.type, support.class	#6B8E23	—
support.constant	#D3D3D3	—
support.type.property-name.json	#808080	—
keyword.operator	#A9A9A9	—
punctuation	#9a9a9a	—
punctuation.definition.string, punctuation.definition.parameters, punctuation.definition.array	#7a7a7a	—
meta.brace, punctuation.section	#808080	—
invalid	#e0e0e0	—
invalid.deprecated	#5a5a5a	strikethrough
markup.heading	#A9A9A9	bold
markup.bold	#808080	bold
markup.italic	#8B9A6B	italic
markup.inline.raw	#6B8E23	—
markup.underline.link	#556B2F	underline
markup.list	#808080	—
markup.inserted	#6B8E23	—
markup.deleted	#696969	—
markup.changed	#8B9A6B	—
variable.language.this	#4a4a4a	italic
entity.name.type.ts, entity.name.type.tsx	#556B2F	—
meta.decorator, punctuation.decorator	#6B8E23	bold
variable.language.special.self.python	#696969	italic
entity.name.function.decorator.python	#6B8E23	—
keyword.control.conditional, keyword.control.loop	#A9A9A9	bold
entity.name.exception, support.class.exception	#696969	bold
storage.type.annotation, punctuation.definition.annotation	#8B9A6B	italic
entity.name.namespace	#556B2F	—
entity.name.tag	#808080	—

VS Code preview

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

Naruto Shinobi Theme — Naruto Shinobi Night

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
export interface User {
  id: string;
  name: string;
  role: "admin" | "member";
  tags: string[];
}

/**
 * Fetch user data by ID
 * @param id
 * @returns User object or null if ID is invalid
 */
export async function fetchUser(id: string): Promise<User | null> {
  if (!id) {
    return null;
  }

  const response = await fetch(`/api/users/${id}`, {
    method: "GET",
    headers: { Accept: "application/json" },
  });

  if (!response.ok) {
    throw new Error(`HTTP ${response.status}`);
  }

  return (await response.json()) as User;
}

function greet(user: User): string {
  // Simple greeting function that uses the user's name
  return `Hello, ${user.name}!`;
}

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.activeBackground#1A1A1A
activityBar.activeBorder#FF6B00
activityBar.activeFocusBorder#FF6B00
activityBar.background#0D0D0D
activityBar.border#1A1A1A
activityBar.dropBorder#FF6B00
activityBar.foreground#FF6B00
activityBar.inactiveForeground#6C6C6C
activityBarBadge.background#CC0000
activityBarBadge.foreground#FFFFFF
badge.background#FF6B00
badge.foreground#FFFFFF
breadcrumb.activeSelectionForeground#FFFFFF
breadcrumb.background#0D0D0D
breadcrumb.focusForeground#FF6B00
breadcrumb.foreground#6C6C6C
breadcrumbPicker.background#0D0D0D
button.background#FF6B00
button.foreground#FFFFFF
button.hoverBackground#FF8C00
button.secondaryBackground#4A90E2
button.secondaryForeground#FFFFFF
button.secondaryHoverBackground#5DADE2
checkbox.background#1A1A1A
checkbox.border#262626
checkbox.foreground#FFFFFF
debugIcon.breakpointCurrentStackframeForeground#FFD700
debugIcon.breakpointDisabledForeground#6C6C6C
debugIcon.breakpointForeground#CC0000
debugIcon.breakpointStackframeForeground#4A90E2
debugIcon.breakpointUnverifiedForeground#6C6C6C
debugIcon.continueForeground#4CAF50
debugIcon.disconnectForeground#CC0000
debugIcon.pauseForeground#FFC107
debugIcon.restartForeground#4A90E2
debugIcon.startForeground#4CAF50
debugIcon.stepBackForeground#4A90E2
debugIcon.stepIntoForeground#4A90E2
debugIcon.stepOutForeground#4A90E2
debugIcon.stepOverForeground#4A90E2
debugIcon.stopForeground#CC0000
debugToolBar.background#0D0D0D
debugToolBar.border#1A1A1A
descriptionForeground#6C6C6C
diffEditor.border#1A1A1A
diffEditor.diagonalFill#4A4A4A30
diffEditor.insertedLineBackground#4CAF5015
diffEditor.insertedTextBackground#4CAF5020
diffEditor.removedLineBackground#CC000015
diffEditor.removedTextBackground#CC000020
dropdown.background#1A1A1A
dropdown.border#262626
dropdown.foreground#FFFFFF
dropdown.listBackground#0D0D0D
editor.background#0D0D0D
editor.findMatchBackground#FFD70060
editor.findMatchHighlightBackground#FFD70030
editor.findRangeHighlightBackground#FF6B0020
editor.foreground#F5F5DC
editor.hoverHighlightBackground#FF6B0020
editor.inactiveSelectionBackground#FF6B0020
editor.lineHighlightBackground#1A1A1A
editor.lineHighlightBorder#1A1A1A00
editor.rangeHighlightBackground#1A1A1A
editor.selectionBackground#FF6B0040
editor.selectionHighlightBackground#FF6B0030
editor.wordHighlightBackground#4A90E230
editor.wordHighlightStrongBackground#4A90E240
editorBracketMatch.background#FF6B0030
editorBracketMatch.border#FF6B00
editorCodeLens.foreground#6C6C6C
editorCursor.background#0D0D0D
editorCursor.foreground#FF6B00
editorError.foreground#CC0000
editorGroup.border#1A1A1A
editorGroup.dropBackground#FF6B0020
editorGroupHeader.border#1A1A1A
editorGroupHeader.noTabsBackground#0D0D0D
editorGroupHeader.tabsBackground#0D0D0D
editorGroupHeader.tabsBorder#1A1A1A
editorGutter.addedBackground#4CAF50
editorGutter.background#0D0D0D
editorGutter.deletedBackground#CC0000
editorGutter.modifiedBackground#4A90E2
editorHint.foreground#00CED1
editorHoverWidget.background#0D0D0D
editorHoverWidget.border#1A1A1A
editorHoverWidget.foreground#E8E8E8
editorHoverWidget.statusBarBackground#1A1A1A
editorIndentGuide.activeBackground1#FF6B0050
editorIndentGuide.background1#4A4A4A30
editorInfo.foreground#4A90E2
editorLineNumber.activeForeground#FF6B00
editorLineNumber.foreground#6C6C6C
editorLink.activeForeground#4A90E2
editorOverviewRuler.border#1A1A1A
editorRuler.foreground#4A4A4A50
editorSuggestWidget.background#0D0D0D
editorSuggestWidget.border#1A1A1A
editorSuggestWidget.focusHighlightForeground#FF8C00
editorSuggestWidget.foreground#E8E8E8
editorSuggestWidget.highlightForeground#FF6B00
editorSuggestWidget.selectedBackground#FF6B0030
editorWarning.foreground#FFC107
editorWhitespace.foreground#4A4A4A40
editorWidget.background#0D0D0D
editorWidget.border#1A1A1A
editorWidget.foreground#E8E8E8
errorForeground#CC0000
focusBorder#FF6B00
foreground#E8E8E8
gitDecoration.conflictingResourceForeground#9C27B0
gitDecoration.deletedResourceForeground#CC0000
gitDecoration.ignoredResourceForeground#6C6C6C
gitDecoration.modifiedResourceForeground#4A90E2
gitDecoration.stageDeletedResourceForeground#CC0000
gitDecoration.stageModifiedResourceForeground#4A90E2
gitDecoration.submoduleResourceForeground#00CED1
gitDecoration.untrackedResourceForeground#4CAF50
icon.foreground#FF6B00
input.background#1A1A1A
input.border#262626
input.foreground#FFFFFF
input.placeholderForeground#6C6C6C
inputOption.activeBackground#FF6B0030
inputOption.activeBorder#FF6B00
inputOption.activeForeground#FFFFFF
inputValidation.errorBackground#CC000030
inputValidation.errorBorder#CC0000
inputValidation.errorForeground#FFFFFF
inputValidation.infoBackground#4A90E230
inputValidation.infoBorder#4A90E2
inputValidation.infoForeground#FFFFFF
inputValidation.warningBackground#FFC10730
inputValidation.warningBorder#FFC107
inputValidation.warningForeground#FFFFFF
keybindingLabel.background#1A1A1A
keybindingLabel.border#262626
keybindingLabel.bottomBorder#262626
keybindingLabel.foreground#FF6B00
list.activeSelectionBackground#FF6B0030
list.activeSelectionForeground#FFFFFF
list.deemphasizedForeground#6C6C6C
list.dropBackground#FF6B0020
list.errorForeground#CC0000
list.filterMatchBackground#FFD70060
list.filterMatchBorder#FFD700
list.focusBackground#FF6B0040
list.focusForeground#FFFFFF
list.highlightForeground#FF6B00
list.hoverBackground#1A1A1A
list.hoverForeground#FFFFFF
list.inactiveSelectionBackground#1A1A1A
list.inactiveSelectionForeground#E8E8E8
list.warningForeground#FFC107
menu.background#0D0D0D
menu.border#1A1A1A
menu.foreground#E8E8E8
menu.selectionBackground#FF6B0030
menu.selectionBorder#FF6B00
menu.selectionForeground#FFFFFF
menu.separatorBackground#1A1A1A
menubar.selectionBackground#1A1A1A
menubar.selectionForeground#FF6B00
merge.border#1A1A1A
merge.commonContentBackground#6C6C6C20
merge.commonHeaderBackground#6C6C6C40
merge.currentContentBackground#4A90E220
merge.currentHeaderBackground#4A90E240
merge.incomingContentBackground#4CAF5020
merge.incomingHeaderBackground#4CAF5040
minimap.errorHighlight#CC0000
minimap.findMatchHighlight#FFD70060
minimap.selectionHighlight#FF6B0040
minimap.warningHighlight#FFC107
minimapGutter.addedBackground#4CAF50
minimapGutter.deletedBackground#CC0000
minimapGutter.modifiedBackground#4A90E2
notificationCenter.border#1A1A1A
notificationCenterHeader.background#1A1A1A
notificationCenterHeader.foreground#FF6B00
notificationLink.foreground#4A90E2
notifications.background#0D0D0D
notifications.border#1A1A1A
notifications.foreground#E8E8E8
notificationsErrorIcon.foreground#CC0000
notificationsInfoIcon.foreground#4A90E2
notificationsWarningIcon.foreground#FFC107
notificationToast.border#1A1A1A
panel.background#0D0D0D
panel.border#1A1A1A
panel.dropBorder#FF6B00
panelInput.border#262626
panelSection.border#1A1A1A
panelSection.dropBackground#FF6B0020
panelSectionHeader.background#1A1A1A
panelSectionHeader.border#262626
panelSectionHeader.foreground#FF8C00
panelTitle.activeBorder#FF6B00
panelTitle.activeForeground#FFFFFF
panelTitle.inactiveForeground#6C6C6C
peekView.border#FF6B00
peekViewEditor.background#0D0D0D
peekViewEditor.matchHighlightBackground#FFD70060
peekViewEditor.matchHighlightBorder#FFD700
peekViewResult.background#0D0D0D
peekViewResult.fileForeground#E8E8E8
peekViewResult.lineForeground#6C6C6C
peekViewResult.matchHighlightBackground#FFD70060
peekViewResult.selectionBackground#FF6B0030
peekViewResult.selectionForeground#FFFFFF
peekViewTitle.background#1A1A1A
peekViewTitleDescription.foreground#6C6C6C
peekViewTitleLabel.foreground#FF6B00
progressBar.background#FF6B00
quickInput.background#0D0D0D
quickInput.foreground#E8E8E8
quickInputList.focusBackground#FF6B0030
quickInputList.focusForeground#FFFFFF
quickInputList.focusIconForeground#FF6B00
scrollbar.shadow#00000050
scrollbarSlider.activeBackground#FF6B0070
scrollbarSlider.background#FF6B0030
scrollbarSlider.hoverBackground#FF6B0050
settings.checkboxBackground#1A1A1A
settings.checkboxBorder#262626
settings.checkboxForeground#FFFFFF
settings.dropdownBackground#1A1A1A
settings.dropdownBorder#262626
settings.dropdownForeground#FFFFFF
settings.dropdownListBorder#262626
settings.headerForeground#FF6B00
settings.modifiedItemIndicator#4A90E2
settings.numberInputBackground#1A1A1A
settings.numberInputBorder#262626
settings.numberInputForeground#FFFFFF
settings.textInputBackground#1A1A1A
settings.textInputBorder#262626
settings.textInputForeground#FFFFFF
sideBar.background#0D0D0D
sideBar.border#1A1A1A
sideBar.foreground#E8E8E8
sideBarSectionHeader.background#1A1A1A
sideBarSectionHeader.border#262626
sideBarSectionHeader.foreground#FF8C00
sideBarTitle.foreground#FF6B00
statusBar.background#FF6B00
statusBar.border#FF6B00
statusBar.debuggingBackground#CC0000
statusBar.debuggingBorder#CC0000
statusBar.debuggingForeground#FFFFFF
statusBar.foreground#FFFFFF
statusBar.noFolderBackground#4A90E2
statusBar.noFolderBorder#4A90E2
statusBar.noFolderForeground#FFFFFF
statusBarItem.activeBackground#FF8C0080
statusBarItem.errorBackground#CC0000
statusBarItem.errorForeground#FFFFFF
statusBarItem.hoverBackground#FF8C0050
statusBarItem.prominentBackground#4A90E2
statusBarItem.prominentHoverBackground#5DADE2
statusBarItem.remoteBackground#4A90E2
statusBarItem.remoteForeground#FFFFFF
statusBarItem.warningBackground#FFC107
statusBarItem.warningForeground#0D0D0D
symbolIcon.arrayForeground#00CED1
symbolIcon.booleanForeground#F39C12
symbolIcon.classForeground#00CED1
symbolIcon.colorForeground#FFD700
symbolIcon.constantForeground#FFD700
symbolIcon.constructorForeground#9C27B0
symbolIcon.enumeratorForeground#FFD700
symbolIcon.enumeratorMemberForeground#FFC107
symbolIcon.eventForeground#FF8C00
symbolIcon.fieldForeground#4A90E2
symbolIcon.fileForeground#E8E8E8
symbolIcon.folderForeground#FF6B00
symbolIcon.functionForeground#9C27B0
symbolIcon.interfaceForeground#17A2B8
symbolIcon.keyForeground#4A90E2
symbolIcon.keywordForeground#FF6B00
symbolIcon.methodForeground#9C27B0
symbolIcon.moduleForeground#00CED1
symbolIcon.namespaceForeground#00CED1
symbolIcon.nullForeground#F39C12
symbolIcon.numberForeground#FFC107
symbolIcon.objectForeground#5DADE2
symbolIcon.operatorForeground#FF8C00
symbolIcon.packageForeground#00CED1
symbolIcon.propertyForeground#4A90E2
symbolIcon.referenceForeground#5DADE2
symbolIcon.snippetForeground#4CAF50
symbolIcon.stringForeground#4CAF50
symbolIcon.structForeground#00CED1
symbolIcon.textForeground#E8E8E8
symbolIcon.typeParameterForeground#5DADE2
symbolIcon.unitForeground#FFC107
symbolIcon.variableForeground#5DADE2
tab.activeBackground#1A1A1A
tab.activeBorder#00000000
tab.activeBorderTop#FF6B00
tab.activeForeground#FFFFFF
tab.activeModifiedBorder#4A90E2
tab.border#1A1A1A
tab.hoverBackground#1A1A1A
tab.hoverBorder#FF8C00
tab.hoverForeground#FFFFFF
tab.inactiveBackground#0D0D0D
tab.inactiveForeground#6C6C6C
tab.inactiveModifiedBorder#4A90E280
tab.unfocusedActiveBackground#1A1A1A
tab.unfocusedActiveBorder#00000000
tab.unfocusedActiveBorderTop#6C6C6C
tab.unfocusedActiveForeground#E8E8E8
tab.unfocusedHoverBackground#1A1A1A
tab.unfocusedHoverForeground#E8E8E8
tab.unfocusedInactiveBackground#0D0D0D
tab.unfocusedInactiveForeground#6C6C6C
terminal.ansiBlack#0D0D0D
terminal.ansiBlue#4A90E2
terminal.ansiBrightBlack#6C6C6C
terminal.ansiBrightBlue#5DADE2
terminal.ansiBrightCyan#17A2B8
terminal.ansiBrightGreen#27AE60
terminal.ansiBrightMagenta#8E44AD
terminal.ansiBrightRed#FF0000
terminal.ansiBrightWhite#FFFFFF
terminal.ansiBrightYellow#FFC107
terminal.ansiCyan#00CED1
terminal.ansiGreen#4CAF50
terminal.ansiMagenta#9C27B0
terminal.ansiRed#CC0000
terminal.ansiWhite#E8E8E8
terminal.ansiYellow#FFD700
terminal.background#0D0D0D
terminal.border#1A1A1A
terminal.foreground#E8E8E8
terminal.selectionBackground#FF6B0040
terminalCursor.background#0D0D0D
terminalCursor.foreground#FF6B00
textBlockQuote.background#1A1A1A
textBlockQuote.border#FF6B00
textCodeBlock.background#0D0D0D
textLink.activeForeground#5DADE2
textLink.foreground#4A90E2
textPreformat.foreground#4CAF50
textSeparator.foreground#262626
titleBar.activeBackground#0D0D0D
titleBar.activeForeground#FF6B00
titleBar.border#1A1A1A
titleBar.inactiveBackground#0D0D0D
titleBar.inactiveForeground#6C6C6C
walkThrough.embeddedEditorBackground#0D0D0D
welcomePage.buttonBackground#1A1A1A
welcomePage.buttonHoverBackground#262626
welcomePage.tileBackground#0D0D0D
welcomePage.tileBorder#1A1A1A

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#6C6C6C	italic
comment.block.documentation, comment.line.documentation	#808080	italic
keyword, storage.type, storage.modifier	#FF6B00	bold
keyword.control, keyword.control.flow	#FF8C00	bold
keyword.control.import, keyword.control.export, keyword.control.from	#FF6B00	—
string, string.quoted, string.quoted.double, string.quoted.single, string.quoted.triple	#4CAF50	—
string.template, string.quoted.template	#4CAF50	—
constant.character.escape, constant.other.placeholder	#27AE60	bold
string.regexp	#27AE60	—
entity.name.function, support.function, meta.function-call.generic	#9C27B0	—
meta.function-call	#8E44AD	—
variable.parameter, meta.parameters	#5DADE2	—
variable, support.variable	#5DADE2	—
variable.other.declaration, meta.definition.variable	#4A90E2	—
variable.object.property, variable.other.property, meta.object-literal.key	#4A90E2	—
variable.language.this, variable.language.self, variable.language.super	#FF8C00	italic bold
entity.name.type, entity.name.class, support.class, entity.other.inherited-class	#00CED1	bold
entity.name.type.interface	#17A2B8	bold
meta.type.annotation, support.type	#00CED1	—
constant, variable.other.constant, support.constant	#FFD700	—
constant.numeric, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.binary, constant.numeric.octal	#FFC107	—
constant.language.boolean, constant.language.true, constant.language.false	#F39C12	bold
constant.language.null, constant.language.undefined, constant.language.none	#F39C12	bold
keyword.operator, keyword.operator.arithmetic, keyword.operator.comparison, keyword.operator.logical, keyword.operator.assignment	#FF8C00	—
keyword.operator.new, keyword.operator.expression.typeof, keyword.operator.expression.instanceof	#FF6B00	—
punctuation	#E8E8E8	—
punctuation.separator, punctuation.terminator	#E8E8E8	—
meta.decorator, punctuation.decorator, entity.name.function.decorator	#FFD700	italic
entity.name.tag, meta.tag.sgml.doctype, meta.tag.metadata	#FF6B00	—
entity.other.attribute-name	#4A90E2	—
entity.other.attribute-name.class, meta.selector.css	#FFD700	—
entity.other.attribute-name.id	#00CED1	—
support.type.property-name.css, meta.property-name	#9C27B0	—
support.constant.property-value.css, meta.property-value	#5DADE2	—
keyword.other.unit	#FFC107	—
support.type.property-name.json, meta.structure.dictionary.key.json	#4A90E2	—
meta.structure.dictionary.value.json string	#4CAF50	—
markup.heading, markup.heading.markdown, entity.name.section.markdown	#FF6B00	bold
markup.bold	#FFC107	bold
markup.italic	#5DADE2	italic
markup.underline.link, string.other.link.title.markdown	#00CED1	underline
markup.inline.raw, markup.fenced_code, markup.raw.block	#4CAF50	—
markup.list.unnumbered, markup.list.numbered	#FF6B00	—
markup.quote	#6C6C6C	italic
variable.parameter.function.language.special.self.python	#FF8C00	italic
support.function.magic.python	#9C27B0	italic
keyword.operator.new	#FF6B00	bold
support.class.component, entity.name.tag.tsx, entity.name.tag.jsx	#00CED1	—
invalid, invalid.illegal	#FF0000	bold underline
invalid.deprecated	#E67E22	strikethrough
markup.inserted, meta.diff.header.to-file	#4CAF50	—
markup.deleted, meta.diff.header.from-file	#CC0000	—
markup.changed	#FFC107	—

VS Code preview

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

Naruto Shinobi Theme — Naruto Tobirama Senju - Water Style Strategist (Second Hokage)

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
export interface User {
  id: string;
  name: string;
  role: "admin" | "member";
  tags: string[];
}

/**
 * Fetch user data by ID
 * @param id
 * @returns User object or null if ID is invalid
 */
export async function fetchUser(id: string): Promise<User | null> {
  if (!id) {
    return null;
  }

  const response = await fetch(`/api/users/${id}`, {
    method: "GET",
    headers: { Accept: "application/json" },
  });

  if (!response.ok) {
    throw new Error(`HTTP ${response.status}`);
  }

  return (await response.json()) as User;
}

function greet(user: User): string {
  // Simple greeting function that uses the user's name
  return `Hello, ${user.name}!`;
}

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.activeBackground#1B2838
activityBar.activeBorder#00CED1
activityBar.activeFocusBorder#00CED1
activityBar.background#0D1B2A
activityBar.border#1B2838
activityBar.dropBorder#00CED1
activityBar.foreground#00CED1
activityBar.inactiveForeground#5A7A8F
activityBarBadge.background#00CED1
activityBarBadge.foreground#0D1B2A
badge.background#006994
badge.foreground#FFFFFF
breadcrumb.activeSelectionForeground#FFFFFF
breadcrumb.background#0D1B2A
breadcrumb.focusForeground#00CED1
breadcrumb.foreground#7A9FB5
breadcrumbPicker.background#0D1B2A
button.background#006994
button.foreground#FFFFFF
button.hoverBackground#00CED1
button.secondaryBackground#4FC3F7
button.secondaryForeground#FFFFFF
button.secondaryHoverBackground#81D4FA
checkbox.background#1B2838
checkbox.border#2C3E50
checkbox.foreground#FFFFFF
debugIcon.breakpointCurrentStackframeForeground#81D4FA
debugIcon.breakpointDisabledForeground#7A9FB5
debugIcon.breakpointForeground#FF6B6B
debugIcon.breakpointStackframeForeground#4FC3F7
debugIcon.breakpointUnverifiedForeground#7A9FB5
debugIcon.continueForeground#5DADE2
debugIcon.disconnectForeground#FF6B6B
debugIcon.pauseForeground#FFB74D
debugIcon.restartForeground#4FC3F7
debugIcon.startForeground#5DADE2
debugIcon.stepBackForeground#4FC3F7
debugIcon.stepIntoForeground#4FC3F7
debugIcon.stepOutForeground#4FC3F7
debugIcon.stepOverForeground#4FC3F7
debugIcon.stopForeground#FF6B6B
debugToolBar.background#0D1B2A
debugToolBar.border#1B2838
descriptionForeground#7A9FB5
diffEditor.border#1B2838
diffEditor.diagonalFill#2C3E5030
diffEditor.insertedLineBackground#5DADE220
diffEditor.insertedTextBackground#5DADE230
diffEditor.removedLineBackground#FF6B6B20
diffEditor.removedTextBackground#FF6B6B30
dropdown.background#1B2838
dropdown.border#2C3E50
dropdown.foreground#FFFFFF
dropdown.listBackground#0D1B2A
editor.background#0D1B2A
editor.findMatchBackground#81D4FA60
editor.findMatchHighlightBackground#81D4FA30
editor.findRangeHighlightBackground#00CED120
editor.foreground#E8F4F8
editor.hoverHighlightBackground#00CED120
editor.inactiveSelectionBackground#00CED120
editor.lineHighlightBackground#1B2838
editor.lineHighlightBorder#1B283800
editor.rangeHighlightBackground#1B2838
editor.selectionBackground#00CED140
editor.selectionHighlightBackground#00CED130
editor.wordHighlightBackground#4FC3F730
editor.wordHighlightStrongBackground#4FC3F740
editorBracketMatch.background#00CED130
editorBracketMatch.border#00CED1
editorCodeLens.foreground#7A9FB5
editorCursor.background#0D1B2A
editorCursor.foreground#00CED1
editorError.foreground#FF6B6B
editorGroup.border#1B2838
editorGroup.dropBackground#00CED120
editorGroupHeader.border#1B2838
editorGroupHeader.noTabsBackground#0D1B2A
editorGroupHeader.tabsBackground#0D1B2A
editorGroupHeader.tabsBorder#1B2838
editorGutter.addedBackground#5DADE2
editorGutter.background#0D1B2A
editorGutter.deletedBackground#FF6B6B
editorGutter.modifiedBackground#4FC3F7
editorHint.foreground#81D4FA
editorHoverWidget.background#0D1B2A
editorHoverWidget.border#1B2838
editorHoverWidget.foreground#E8F4F8
editorHoverWidget.statusBarBackground#1B2838
editorIndentGuide.activeBackground1#00CED150
editorIndentGuide.background1#2C3E5030
editorInfo.foreground#4FC3F7
editorLineNumber.activeForeground#00CED1
editorLineNumber.foreground#5A7A8F
editorLink.activeForeground#4FC3F7
editorOverviewRuler.border#1B2838
editorRuler.foreground#2C3E5050
editorSuggestWidget.background#0D1B2A
editorSuggestWidget.border#1B2838
editorSuggestWidget.focusHighlightForeground#4FC3F7
editorSuggestWidget.foreground#E8F4F8
editorSuggestWidget.highlightForeground#00CED1
editorSuggestWidget.selectedBackground#00CED130
editorWarning.foreground#FFB74D
editorWhitespace.foreground#2C3E5040
editorWidget.background#0D1B2A
editorWidget.border#1B2838
editorWidget.foreground#E8F4F8
errorForeground#FF6B6B
focusBorder#00CED1
foreground#E8F4F8
gitDecoration.conflictingResourceForeground#9C88FF
gitDecoration.deletedResourceForeground#FF6B6B
gitDecoration.ignoredResourceForeground#7A9FB5
gitDecoration.modifiedResourceForeground#4FC3F7
gitDecoration.stageDeletedResourceForeground#FF6B6B
gitDecoration.stageModifiedResourceForeground#4FC3F7
gitDecoration.submoduleResourceForeground#00CED1
gitDecoration.untrackedResourceForeground#5DADE2
icon.foreground#00CED1
input.background#1B2838
input.border#2C3E50
input.foreground#FFFFFF
input.placeholderForeground#7A9FB5
inputOption.activeBackground#00CED130
inputOption.activeBorder#00CED1
inputOption.activeForeground#FFFFFF
inputValidation.errorBackground#FF6B6B40
inputValidation.errorBorder#FF6B6B
inputValidation.errorForeground#FFFFFF
inputValidation.infoBackground#4FC3F740
inputValidation.infoBorder#4FC3F7
inputValidation.infoForeground#FFFFFF
inputValidation.warningBackground#FFB74D40
inputValidation.warningBorder#FFB74D
inputValidation.warningForeground#FFFFFF
keybindingLabel.background#1B2838
keybindingLabel.border#2C3E50
keybindingLabel.bottomBorder#2C3E50
keybindingLabel.foreground#00CED1
list.activeSelectionBackground#00CED130
list.activeSelectionForeground#FFFFFF
list.deemphasizedForeground#7A9FB5
list.dropBackground#00CED120
list.errorForeground#FF6B6B
list.filterMatchBackground#81D4FA60
list.filterMatchBorder#81D4FA
list.focusBackground#00CED140
list.focusForeground#FFFFFF
list.highlightForeground#00CED1
list.hoverBackground#1B2838
list.hoverForeground#FFFFFF
list.inactiveSelectionBackground#1B2838
list.inactiveSelectionForeground#E8F4F8
list.warningForeground#FFB74D
menu.background#0D1B2A
menu.border#1B2838
menu.foreground#E8F4F8
menu.selectionBackground#00CED130
menu.selectionBorder#00CED1
menu.selectionForeground#FFFFFF
menu.separatorBackground#1B2838
menubar.selectionBackground#1B2838
menubar.selectionForeground#00CED1
merge.border#1B2838
merge.commonContentBackground#7A9FB530
merge.commonHeaderBackground#7A9FB550
merge.currentContentBackground#4FC3F730
merge.currentHeaderBackground#4FC3F750
merge.incomingContentBackground#5DADE230
merge.incomingHeaderBackground#5DADE250
minimap.errorHighlight#FF6B6B
minimap.findMatchHighlight#81D4FA60
minimap.selectionHighlight#00CED140
minimap.warningHighlight#FFB74D
minimapGutter.addedBackground#5DADE2
minimapGutter.deletedBackground#FF6B6B
minimapGutter.modifiedBackground#4FC3F7
notificationCenter.border#1B2838
notificationCenterHeader.background#1B2838
notificationCenterHeader.foreground#00CED1
notificationLink.foreground#4FC3F7
notifications.background#0D1B2A
notifications.border#1B2838
notifications.foreground#E8F4F8
notificationsErrorIcon.foreground#FF6B6B
notificationsInfoIcon.foreground#4FC3F7
notificationsWarningIcon.foreground#FFB74D
notificationToast.border#1B2838
panel.background#0D1B2A
panel.border#1B2838
panel.dropBorder#00CED1
panelInput.border#2C3E50
panelSection.border#1B2838
panelSection.dropBackground#00CED120
panelSectionHeader.background#1B2838
panelSectionHeader.border#2C3E50
panelSectionHeader.foreground#4FC3F7
panelTitle.activeBorder#00CED1
panelTitle.activeForeground#FFFFFF
panelTitle.inactiveForeground#7A9FB5
peekView.border#00CED1
peekViewEditor.background#0D1B2A
peekViewEditor.matchHighlightBackground#81D4FA60
peekViewEditor.matchHighlightBorder#81D4FA
peekViewResult.background#0D1B2A
peekViewResult.fileForeground#E8F4F8
peekViewResult.lineForeground#7A9FB5
peekViewResult.matchHighlightBackground#81D4FA60
peekViewResult.selectionBackground#00CED130
peekViewResult.selectionForeground#FFFFFF
peekViewTitle.background#1B2838
peekViewTitleDescription.foreground#7A9FB5
peekViewTitleLabel.foreground#00CED1
progressBar.background#00CED1
quickInput.background#0D1B2A
quickInput.foreground#E8F4F8
quickInputList.focusBackground#00CED130
quickInputList.focusForeground#FFFFFF
quickInputList.focusIconForeground#00CED1
scrollbar.shadow#00000050
scrollbarSlider.activeBackground#00CED170
scrollbarSlider.background#00CED130
scrollbarSlider.hoverBackground#00CED150
settings.checkboxBackground#1B2838
settings.checkboxBorder#2C3E50
settings.checkboxForeground#FFFFFF
settings.dropdownBackground#1B2838
settings.dropdownBorder#2C3E50
settings.dropdownForeground#FFFFFF
settings.dropdownListBorder#2C3E50
settings.headerForeground#00CED1
settings.modifiedItemIndicator#4FC3F7
settings.numberInputBackground#1B2838
settings.numberInputBorder#2C3E50
settings.numberInputForeground#FFFFFF
settings.textInputBackground#1B2838
settings.textInputBorder#2C3E50
settings.textInputForeground#FFFFFF
sideBar.background#0D1B2A
sideBar.border#1B2838
sideBar.foreground#E8F4F8
sideBarSectionHeader.background#1B2838
sideBarSectionHeader.border#2C3E50
sideBarSectionHeader.foreground#4FC3F7
sideBarTitle.foreground#00CED1
statusBar.background#006994
statusBar.border#006994
statusBar.debuggingBackground#FF6B6B
statusBar.debuggingBorder#FF6B6B
statusBar.debuggingForeground#FFFFFF
statusBar.foreground#FFFFFF
statusBar.noFolderBackground#4FC3F7
statusBar.noFolderBorder#4FC3F7
statusBar.noFolderForeground#FFFFFF
statusBarItem.activeBackground#00CED180
statusBarItem.errorBackground#FF6B6B
statusBarItem.errorForeground#FFFFFF
statusBarItem.hoverBackground#00CED150
statusBarItem.prominentBackground#00CED1
statusBarItem.prominentHoverBackground#00B8D4
statusBarItem.remoteBackground#4FC3F7
statusBarItem.remoteForeground#FFFFFF
statusBarItem.warningBackground#FFB74D
statusBarItem.warningForeground#0D1B2A
symbolIcon.arrayForeground#00CED1
symbolIcon.booleanForeground#FFB74D
symbolIcon.classForeground#00CED1
symbolIcon.colorForeground#81D4FA
symbolIcon.constantForeground#E0F7FA
symbolIcon.constructorForeground#9C88FF
symbolIcon.enumeratorForeground#E0F7FA
symbolIcon.enumeratorMemberForeground#B3E5FC
symbolIcon.eventForeground#4FC3F7
symbolIcon.fieldForeground#81D4FA
symbolIcon.fileForeground#E8F4F8
symbolIcon.folderForeground#00CED1
symbolIcon.functionForeground#9C88FF
symbolIcon.interfaceForeground#80DEEA
symbolIcon.keyForeground#4FC3F7
symbolIcon.keywordForeground#00CED1
symbolIcon.methodForeground#9C88FF
symbolIcon.moduleForeground#00CED1
symbolIcon.namespaceForeground#00CED1
symbolIcon.nullForeground#FFB74D
symbolIcon.numberForeground#B3E5FC
symbolIcon.objectForeground#4FC3F7
symbolIcon.operatorForeground#81D4FA
symbolIcon.packageForeground#00CED1
symbolIcon.propertyForeground#81D4FA
symbolIcon.referenceForeground#4FC3F7
symbolIcon.snippetForeground#5DADE2
symbolIcon.stringForeground#5DADE2
symbolIcon.structForeground#00CED1
symbolIcon.textForeground#E8F4F8
symbolIcon.typeParameterForeground#4FC3F7
symbolIcon.unitForeground#B3E5FC
symbolIcon.variableForeground#4FC3F7
tab.activeBackground#1B2838
tab.activeBorder#00000000
tab.activeBorderTop#00CED1
tab.activeForeground#FFFFFF
tab.activeModifiedBorder#4FC3F7
tab.border#1B2838
tab.hoverBackground#1B2838
tab.hoverBorder#4FC3F7
tab.hoverForeground#FFFFFF
tab.inactiveBackground#0D1B2A
tab.inactiveForeground#7A9FB5
tab.inactiveModifiedBorder#4FC3F780
tab.unfocusedActiveBackground#1B2838
tab.unfocusedActiveBorder#00000000
tab.unfocusedActiveBorderTop#5A7A8F
tab.unfocusedActiveForeground#E8F4F8
tab.unfocusedHoverBackground#1B2838
tab.unfocusedHoverForeground#E8F4F8
tab.unfocusedInactiveBackground#0D1B2A
tab.unfocusedInactiveForeground#7A9FB5
terminal.ansiBlack#0D1B2A
terminal.ansiBlue#4FC3F7
terminal.ansiBrightBlack#5A7A8F
terminal.ansiBrightBlue#80DEEA
terminal.ansiBrightCyan#18FFFF
terminal.ansiBrightGreen#81D4FA
terminal.ansiBrightMagenta#B39DDB
terminal.ansiBrightRed#FF8A80
terminal.ansiBrightWhite#FFFFFF
terminal.ansiBrightYellow#FFD180
terminal.ansiCyan#00CED1
terminal.ansiGreen#5DADE2
terminal.ansiMagenta#9C88FF
terminal.ansiRed#FF6B6B
terminal.ansiWhite#E8F4F8
terminal.ansiYellow#FFB74D
terminal.background#0D1B2A
terminal.border#1B2838
terminal.foreground#E8F4F8
terminal.selectionBackground#00CED140
terminalCursor.background#0D1B2A
terminalCursor.foreground#00CED1
textBlockQuote.background#1A2838
textBlockQuote.border#00CED1
textCodeBlock.background#0D1B2A
textLink.activeForeground#00CED1
textLink.foreground#4FC3F7
textPreformat.foreground#5DADE2
textSeparator.foreground#2C3E50
titleBar.activeBackground#0D1B2A
titleBar.activeForeground#00CED1
titleBar.border#1B2838
titleBar.inactiveBackground#0D1B2A
titleBar.inactiveForeground#5A7A8F
walkThrough.embeddedEditorBackground#0D1B2A
welcomePage.buttonBackground#1B2838
welcomePage.buttonHoverBackground#2C3E50
welcomePage.tileBackground#0D1B2A
welcomePage.tileBorder#1B2838

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, punctuation.definition.comment	#5A7A8F	italic
comment.block.documentation, comment.line.documentation	#7A9FB5	italic
keyword, storage.type, storage.modifier	#00CED1	bold
keyword.control, keyword.control.flow	#4FC3F7	bold
keyword.control.import, keyword.control.export, keyword.control.from	#00CED1	—
string, string.quoted, string.quoted.double, string.quoted.single, string.quoted.triple	#5DADE2	—
string.template, string.quoted.template	#5DADE2	—
constant.character.escape, constant.other.placeholder	#18FFFF	bold
string.regexp	#18FFFF	—
entity.name.function, support.function, meta.function-call.generic	#9C88FF	—
meta.function-call	#B39DDB	—
variable.parameter, meta.parameters	#4FC3F7	—
variable, support.variable	#4FC3F7	—
variable.other.declaration, meta.definition.variable	#81D4FA	—
variable.object.property, variable.other.property, meta.object-literal.key	#81D4FA	—
variable.language.this, variable.language.self, variable.language.super	#4FC3F7	italic bold
entity.name.type, entity.name.class, support.class, entity.other.inherited-class	#00CED1	bold
entity.name.type.interface	#80DEEA	bold
meta.type.annotation, support.type	#00CED1	—
constant, variable.other.constant, support.constant	#E0F7FA	—
constant.numeric, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.binary, constant.numeric.octal	#B3E5FC	—
constant.language.boolean	#FFB74D	—
entity.name.tag	#00CED1	—
entity.other.attribute-name	#4FC3F7	—
keyword.operator	#81D4FA	—
punctuation	#E8F4F8	—