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.

  • activityBar.activeBorder#AAAAAA
  • activityBar.background#242424
  • activityBar.border#525252
  • activityBar.foreground#AAAAAA
  • activityBarBadge.background#FF79C6
  • activityBarBadge.foreground#525252
  • badge.background#663399
  • breadcrumb.background#333333
  • button.background#663399
  • debugExceptionWidget.border#525252
  • dropdown.border#525252
  • editor.background#242424
  • editor.foreground#D9D9D9
  • editor.selectionBackground#454545
  • editor.selectionHighlightBackground#454545
  • editorBracketMatch.border#525252
  • editorCursor.foreground#747474
  • editorGroup.border#5DB0D745
  • editorHoverWidget.border#525252
  • editorLineNumber.foreground#747474
  • editorSuggestWidget.border#525252
  • focusBorder#747474
  • input.border#525252
  • inputOption.activeBorder#FFFFFF
  • menu.selectionBackground#525252
  • merge.border#525252
  • minimap.background#333333
  • panel.border#525252
  • panelTitle.activeBorder#AAAAAA
  • peekView.border#525252
  • pickerGroup.border#525252
  • selection.background#454545
  • sideBar.background#333333
  • sideBar.border#525252
  • sideBarSectionHeader.border#525252
  • statusBar.background#585959
  • statusBar.border#5DB0D745
  • tab.activeBorder#525252
  • tab.border#525252
  • terminal.ansiBlack#21222C
  • terminal.ansiBlue#BD93F9
  • terminal.ansiBrightBlack#6272A4
  • terminal.ansiBrightBlue#D6ACFF
  • terminal.ansiBrightCyan#A4FFFF
  • terminal.ansiBrightGreen#69FF94
  • terminal.ansiBrightMagenta#FF92DF
  • terminal.ansiBrightRed#FF6E6E
  • terminal.ansiBrightWhite#FFFFFF
  • terminal.ansiBrightYellow#FFFFA5
  • terminal.ansiCyan#8BE9FD
  • terminal.ansiGreen#50FA7B
  • terminal.ansiMagenta#FF79C6
  • terminal.ansiRed#FF5555
  • terminal.ansiWhite#F8F8F2
  • terminal.ansiYellow#F1FA8C
  • terminal.background#242424
  • terminal.foreground#D9D9D9
  • titleBar.activeBackground#585959
  • titleBar.border#525252

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#747474
variable#5DB0D7
keyword.operator, storage.type.function.arrow#D2C057
string#ce9178
punctuation.separator.comma, punctuation.terminator.statement#FFFFFF90
keyword, storage.type, storage.modifier, keyword.operator.new, keyword.operator.expression#9A7FD5
constant, constant.numeric, constant.language#A1F7B5
variable.other.object, support.constant#FFFFFF
variable.other.property, variable.other.object.property, variable.other.constant.property#D2C057
variable.other.object.property#ce917899
meta.object.member#D2C057
meta.definition.function, meta.function.expression, meta.definition.method#5DB0D7
meta.function-call#D2C057
support.function#FFFFFF
punctuation.accessor#FFFFFF
entity.name.type.class, entity.name.type.module#5DB0D7
entity.other.inherited-class#D2C057
punctuation.definition.block, meta.brace.square, meta.brace.round, punctuation.definition.parameters, punctuation.definition.binding-pattern.object, punctuation.definition.arguments#FFFFFF
entity.name.tag, punctuation.definition.tag.begin, punctuation.definition.tag.end#5DB0D7
entity.other.attribute-name#FFFFFF93
support.class#FFFFFF
support.function.console.js#D2C057
punctuation.definition.block.tag.jsdoc, storage.type.class.jsdoc, comment.block.documentation.js#747474
support.function.json#D2C057
variable.other.readwrite.alias#5DB0D7
constant.language.import-export-all#FFFFFF
entity.name.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html#5DB0D7
entity.other.attribute-name.html#FFFFFF93
punctuation.definition.comment.html, comment.block.html#747474
support.type.property-name.json#FFFFFF
meta.structure.dictionary.value.json, string.quoted.double.json#ce9178
constant.language.json, constant.numeric.json#5DB0D7
punctuation.support.type.property-name.end.json, punctuation.support.type.property-name.begin.json#D2C057
punctuation.separator.dictionary.key-value.json, punctuation.separator.dictionary.pair.json#FFFFFF
meta.property.yaml#5DB0D7
entity.name.tag.yaml#FFFFFF
Silot UI Theme by Joshim Uddin - VS Code Theme