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#F2F2F2
  • activityBar.foreground#2E2E2E
  • activityBar.inactiveForeground#A7A7A7
  • breadcrumb.focusForeground#2E2E2E
  • breadcrumb.foreground#757575
  • editor.background#F2F2F2
  • editor.foreground#474747
  • editor.lineHighlightBackground#DCDCDC
  • editor.selectionBackground#BCBCBC
  • editorCursor.background#F2F2F2
  • editorCursor.foreground#2E2E2E
  • editorGroupHeader.tabsBackground#F2F2F2
  • editorInlayHint.background#F2F2F2
  • editorInlayHint.foreground#757575
  • editorInlayHint.parameterBackground#F2F2F2
  • editorInlayHint.parameterForeground#757575
  • editorInlayHint.typeBackground#F2F2F2
  • editorInlayHint.typeForeground#757575
  • editorLineNumber.activeForeground#2E2E2E
  • editorLineNumber.foreground#A7A7A7
  • editorWidget.background#DCDCDC
  • focusBorder#A7A7A7
  • foreground#474747
  • list.activeSelectionBackground#BCBCBC
  • list.focusBackground#BCBCBC
  • list.highlightForeground#2E2E2E
  • rust_analyzer.inlayHints.foreground#757575
  • sideBar.background#F2F2F2
  • statusBar.background#F2F2F2
  • statusBar.debuggingBackground#F2F2F2
  • statusBar.foreground#A7A7A7
  • statusBar.noFolderBackground#F2F2F2
  • tab.activeBackground#DCDCDC
  • tab.activeForeground#2E2E2E
  • tab.inactiveBackground#F2F2F2
  • tab.inactiveForeground#757575
  • terminal.ansiBlack#DCDCDC
  • terminal.ansiBlue#259CCA
  • terminal.ansiBrightBlack#757575
  • terminal.ansiBrightBlue#3A78A1
  • terminal.ansiBrightCyan#6C6AA4
  • terminal.ansiBrightGreen#607C42
  • terminal.ansiBrightMagenta#9C5A6F
  • terminal.ansiBrightRed#CE7162
  • terminal.ansiBrightWhite#2E2E2E
  • terminal.ansiBrightYellow#797430
  • terminal.ansiCyan#6C6AA4
  • terminal.ansiGreen#5E7D3B
  • terminal.ansiMagenta#9C5A6F
  • terminal.ansiRed#CE7162
  • terminal.ansiWhite#474747
  • terminal.ansiYellow#797430
  • terminal.foreground#474747
  • terminalCursor.background#F2F2F2
  • terminalCursor.foreground#2E2E2E
  • titleBar.activeBackground#F2F2F2
  • titleBar.activeForeground#474747
  • titleBar.inactiveBackground#F2F2F2
  • titleBar.inactiveForeground#A7A7A7

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#2E2E2Eitalic
comment.line.documentation#2E2E2E
comment.block.documentation#2E2E2E
comment.block.javadoc#2E2E2E
entity.name.function.decorator#757575
storage.type.annotation#757575
punctuation.definition.annotation#757575
keyword.operator#474747
markup.deleted#CE7162
markup.inserted#5E7D3B
markup.changed#259CCA
meta.diff#A7A7A7
comment.line.number-sign.git-commit#757575
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...