Skip to main content
Coding Theme

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.

  • activityBarBadge.background#f00000
  • editor.background#141414
  • editor.foreground#e2e2e2
  • editor.inactiveSelectionBackground#332000
  • editor.inactiveSelectionBorder#332000
  • editor.lineHighlightBackground#1f1f1f
  • editor.lineHighlightBorder#1f1f1f
  • editor.selectionBackground#3c3c3c
  • editor.selectionBorder#3c3c3c
  • editor.selectionForeground#e2e2e2
  • editor.selectionHighlightBackground#3f3f3f
  • editor.selectionHighlightBorder#3f3f3f
  • editorCursor.foreground#e2e2e2
  • editorIndentGuide.activeBackground#4f4f4f
  • editorIndentGuide.background#3f3f3f
  • editorLink.activeForeground#f0f0f0
  • editorRuler.foreground#e2e2e2
  • sideBar.background#141414
  • sideBar.border#303030
  • sideBar.dropBackground#202020
  • sideBar.foreground#e2e2e2
  • sideBarSectionHeader.background#303030
  • sideBarSectionHeader.foreground#e2e2e2
  • sideBarTitle.foreground#e2e2e2
  • tab.activeBorder#ef4426
  • tab.activeModifiedBorder#f0f0f0
  • tab.unfocusedActiveBorder#4e4e4e

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#EEEEEE
comment#4D4D4D
comment.line#3C3C3C
comment.block#4F4F4F
constant#F1FF30
constant.numeric#F1FF30
constant.numeric.integer#F1FF30
constant.numeric.float#FFBF00
constant.numeric.hex constant.numeric.octal#BFFF00
constant.character#FFBF00
constant.language#F1FF30
constant.other#BFFF00
entity.name.type#9C733D
entity.name.class#BD8B1E
entity.name.enum#BD8B1E
entity.name.function#48ADF0
entity.name.tag#ff0066
entity.other.attribute-name#36a6ff
entity.other.inherited-class#36a6ff
invalid#FFFFFFunderline
invalid.illegal#FFFFFFunderline
invalid.deprecated#FFFFFFunderline
keyword#F1FF30
keyword.control#ff3e3e
keyword.control.conditional#ca2010
keyword.control.import#ca101d
keyword.operator#F1FF30
keyword.operator.assignment#ff7c00
keyword.operator.arithmetic#ff0065
keyword.operator.bitwise#00ffb5
keyword.operator.logical#ffaf00
keyword.operator.word#ffaf00
punctuation.definition.keyword#ff3e3e
keyword.operator.other#ff3e76
punctuation.separator#FFFCAD
punctuation.accessor#B2E9FF
punctuation.terminator#999999
storage#ab673f
storage.type#cc9966
support.constant#3DDB89
support.function#F1FF30
support.module#F1FF30
support.type#FFDE96
support.class#A6FF96
support.other#F5B862
string#F1FF30
variable#85FF9D
variable.parameter#ff9999
variable.function#00FF7B
variable.other#00FF7B
variable.other.readwrite#00FF7B
variable.language#FF7300

Shiki preview

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

Loading...