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#5898B7
  • terminal.ansiBrightBlack#696969
  • terminal.ansiBrightBlue#5D7587
  • terminal.ansiBrightCyan#6F6F89
  • terminal.ansiBrightGreen#6A775E
  • terminal.ansiBrightMagenta#866870
  • terminal.ansiBrightRed#BB7D72
  • terminal.ansiBrightWhite#161616
  • terminal.ansiBrightYellow#757358
  • terminal.ansiCyan#6F6F89
  • terminal.ansiGreen#667953
  • terminal.ansiMagenta#866870
  • terminal.ansiRed#BB7D72
  • terminal.ansiWhite#333333
  • terminal.ansiYellow#757358
  • 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#5D7587
storage#5D7587
variable.language.self#5D7587
variable.language.this#5D7587
keyword.type.go#5D7587
keyword.control#5898B7
entity.name.type#757358
keyword.type#757358
storage.type.cs#757358
storage.type.java#757358
storage.type.boolean.go#757358
storage.type.byte.go#757358
storage.type.error.go#757358
storage.type.numeric.go#757358
storage.type.rune.go#757358
storage.type.string.go#757358
storage.type.uintptr.go#757358
entity.name.type.interface#5898B7
entity.name.type.type-parameter#5898B7
constant#866870
constant.numeric#AB7DA7
string#667953
entity.name.variable.field#6F6F89
entity.name.variable.property#6F6F89
variable.other.member#6F6F89
variable.other.object.property#6F6F89
variable.other.readwrite.instance#6F6F89
support.type.property-name#6F6F89
entity.name.variable.enum-member#6F6F89
constant.other.enum#6F6F89
variable.other.enummember#6F6F89
entity.name.type.option#6F6F89
entity.name.type.result#6F6F89
entity.name.function.macro#6A775E
entity.name.function.preprocessor#6A775E
constant.other.placeholder#6F6F89
punctuation.definition.interpolation#6F6F89
punctuation.section.embedded#6F6F89
constant.character.escape#6F6F89
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#BB7D72
markup.inserted#667953
markup.changed#5898B7
meta.diff#A4A4A4
comment.line.number-sign.git-commit#696969
invalid.deprecated.line-too-long.git-commit#866870
invalid.illegal.line-too-long.git-commit#BB7D72
magit.entity#667953
magit.header#5D7587
magit.subheader#5898B7

Shiki preview

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

Loading...