Skip to main content
CodingTheme

Color themes

VS Code preview

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

Loading...

colors

Workbench UI color keys from the theme JSON colors map.

  • activityBar.background#FFFFFF
  • activityBar.foreground#161616
  • activityBar.inactiveForeground#A4A4A4
  • breadcrumb.focusForeground#161616
  • breadcrumb.foreground#696969
  • editor.background#FFFFFF
  • editor.foreground#333333
  • editor.lineHighlightBackground#E4E4E4
  • editor.selectionBackground#BEBEBD
  • editorCursor.background#FFFFFF
  • editorCursor.foreground#161616
  • editorGroupHeader.tabsBackground#FFFFFF
  • editorInlayHint.background#FFFFFF
  • editorInlayHint.foreground#696969
  • editorInlayHint.parameterBackground#FFFFFF
  • editorInlayHint.parameterForeground#696969
  • editorInlayHint.typeBackground#FFFFFF
  • editorInlayHint.typeForeground#696969
  • editorLineNumber.activeForeground#161616
  • editorLineNumber.foreground#A4A4A4
  • editorWidget.background#E4E4E4
  • focusBorder#A4A4A4
  • foreground#333333
  • list.activeSelectionBackground#BEBEBD
  • list.focusBackground#BEBEBD
  • list.highlightForeground#161616
  • rust_analyzer.inlayHints.foreground#696969
  • sideBar.background#FFFFFF
  • statusBar.background#FFFFFF
  • statusBar.debuggingBackground#FFFFFF
  • statusBar.foreground#A4A4A4
  • statusBar.noFolderBackground#FFFFFF
  • tab.activeBackground#E4E4E4
  • tab.activeForeground#161616
  • tab.inactiveBackground#FFFFFF
  • tab.inactiveForeground#696969
  • terminal.ansiBlack#E4E4E4
  • terminal.ansiBlue#259CCA
  • terminal.ansiBrightBlack#696969
  • terminal.ansiBrightBlue#3A78A1
  • terminal.ansiBrightCyan#6C6AA4
  • terminal.ansiBrightGreen#607C42
  • terminal.ansiBrightMagenta#9C5A6F
  • terminal.ansiBrightRed#CE7162
  • terminal.ansiBrightWhite#161616
  • terminal.ansiBrightYellow#797430
  • terminal.ansiCyan#6C6AA4
  • terminal.ansiGreen#5E7D3B
  • terminal.ansiMagenta#9C5A6F
  • terminal.ansiRed#CE7162
  • terminal.ansiWhite#333333
  • terminal.ansiYellow#797430
  • terminal.foreground#333333
  • terminalCursor.background#FFFFFF
  • terminalCursor.foreground#161616
  • titleBar.activeBackground#FFFFFF
  • titleBar.activeForeground#333333
  • titleBar.inactiveBackground#FFFFFF
  • titleBar.inactiveForeground#A4A4A4

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
keyword#3A78A1
storage#3A78A1
variable.language.self#3A78A1
variable.language.this#3A78A1
keyword.type.go#3A78A1
keyword.control#259CCA
entity.name.type#797430
keyword.type#797430
storage.type.cs#797430
storage.type.java#797430
storage.type.boolean.go#797430
storage.type.byte.go#797430
storage.type.error.go#797430
storage.type.numeric.go#797430
storage.type.rune.go#797430
storage.type.string.go#797430
storage.type.uintptr.go#797430
entity.name.type.interface#259CCA
entity.name.type.type-parameter#259CCA
constant#9C5A6F
constant.numeric#B873B2
string#5E7D3B
entity.name.variable.field#6C6AA4
entity.name.variable.property#6C6AA4
variable.other.member#6C6AA4
variable.other.object.property#6C6AA4
variable.other.readwrite.instance#6C6AA4
support.type.property-name#6C6AA4
entity.name.variable.enum-member#6C6AA4
constant.other.enum#6C6AA4
variable.other.enummember#6C6AA4
entity.name.type.option#6C6AA4
entity.name.type.result#6C6AA4
entity.name.function.macro#607C42
entity.name.function.preprocessor#607C42
constant.other.placeholder#6C6AA4
punctuation.definition.interpolation#6C6AA4
punctuation.section.embedded#6C6AA4
constant.character.escape#6C6AA4
comment#161616italic
comment.line.documentation#161616
comment.block.documentation#161616
comment.block.javadoc#161616
entity.name.function.decorator#696969
storage.type.annotation#696969
punctuation.definition.annotation#696969
keyword.operator#333333
markup.deleted#CE7162
markup.inserted#5E7D3B
markup.changed#259CCA
meta.diff#A4A4A4
comment.line.number-sign.git-commit#696969
invalid.deprecated.line-too-long.git-commit#9C5A6F
invalid.illegal.line-too-long.git-commit#CE7162
magit.entity#5E7D3B
magit.header#3A78A1
magit.subheader#259CCA

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...