Skip to main content
Coding Theme

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.activeBackground#7a0101
  • activityBar.background#a80000
  • activityBar.border#3d1f03
  • activityBar.foreground#f8e1b6
  • activityBar.inactiveForeground#3d1f03
  • activityBarBadge.background#d30000
  • badge.background#f8e1b6
  • breadcrumb.activeSelectionForeground#c92800
  • button.background#c20000
  • button.foreground#f8e1b6
  • contrastActiveBorder#3d1f03
  • contrastBorder#3d1f03
  • descriptionForeground#f8e1b6
  • dropdown.background#f8e1b6
  • dropdown.border#3d1f039c
  • dropdown.foreground#a5570f
  • dropdown.listBackground#f8e1b6
  • editor.background#e7c27c
  • editor.foreground#a5570f
  • editor.inactiveSelectionBackground#64c06c86
  • editor.selectionBackground#c7150885
  • editor.selectionForeground#f8e1b6
  • editor.selectionHighlightBackground#c7150886
  • editor.wordHighlightBackground#bb0c003a
  • editor.wordHighlightStrongBackground#bb0c003a
  • editorCursor.background#f8e1b6
  • editorCursor.foreground#c71508e5
  • editorGroup.border#f8e1b6
  • editorGroupHeader.noTabsBackground#f8e1b6
  • editorGroupHeader.tabsBackground#f7d9a1
  • editorGroupHeader.tabsBorder#c72103
  • editorLineNumber.foreground#9e491183
  • editorOverviewRuler.border#e200004d
  • editorSuggestWidget.highlightForeground#30ff29
  • editorWidget.border#c20000
  • editorWidget.resizeBorder#c20000
  • focusBorder#c20000
  • icon.foreground#3d1f039c
  • list.activeSelectionForeground#552001bb
  • list.highlightForeground#552001bb
  • list.inactiveSelectionForeground#552001bb
  • menu.foreground#3b2102
  • menu.selectionBackground#3b2102ad
  • menu.selectionForeground#552001bb
  • menubar.selectionBackground#c90f0fd2
  • menubar.selectionForeground#552001bb
  • notificationLink.foreground#552001bb
  • panelTitle.activeBorder#552001bb
  • pickerGroup.foreground#552001bb
  • progressBar.background#552001bb
  • scrollbarSlider.activeBackground#552001b0
  • scrollbarSlider.background#d6020293
  • selection.background#3d1f039c
  • settings.headerForeground#552001bb
  • settings.modifiedItemIndicator#552001bb
  • sideBar.background#f8e1b6
  • sideBar.border#3d1f03
  • sideBar.dropBackground#f8e1b6
  • sideBar.foreground#3d1f03
  • sideBarSectionHeader.background#fad591
  • sideBarSectionHeader.border#3d1f03
  • sideBarSectionHeader.foreground#a30303
  • sideBarTitle.foreground#80299b
  • statusBar.background#d62000
  • statusBar.foreground#ffdb98
  • statusBarItem.remoteBackground#c51700
  • statusBarItem.remoteForeground#f8de98
  • tab.activeBackground#cf3202
  • tab.activeBorder#c40000
  • tab.activeForeground#f8e1b6
  • tab.hoverBackground#ff000060
  • tab.hoverBorder#ff000000
  • tab.inactiveBackground#f8e1b6
  • tab.inactiveForeground#b61500c7
  • textLink.foreground#2979ff
  • titleBar.activeBackground#681800
  • titleBar.activeForeground#ffc918
  • window.activeBorder#e00202
  • window.inactiveBorder#b81f7d

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#84CA55italic
comment.block.preprocessor#84CA55
comment.documentation, comment.block.documentation#448C27
invalid.illegal#660000
keyword.operator#CA2914
keyword, storage#D8240C
storage.type, support.type#CA2914
constant.language, support.constant, variable.language#CA2914
variable.parameter.function.language.special.self.python#CA2914
variable, support.variable, meta.function-call.arguments.python#3d1f03
entity.name.function, support.function#468B43bold
support.function.builtin.python#D3A200bold
entity.name.type, entity.other.inherited-class, support.class#7A3E9Ditalic bold
entity.name.exception#660000
entity.name.sectionbold
constant.numeric, constant.character, constant#437FEE
string#36af06
constant.character.escape#36af06
string.regexp#7DF52E
constant.other.symbol#AB2A26
punctuation#36af06
meta.tag.sgml.doctype, meta.tag.sgml.doctype string, meta.tag.sgml.doctype entity.name.tag, meta.tag.sgml punctuation.definition.tag.html#AAAAAA
punctuation.definition.tag.begin, punctuation.definition.tag.end#3CBCEE
meta.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html#AD4509
entity.name.tag#0E3E79
meta.tag entity.other.attribute-name, entity.other.attribute-name.html#0E3E79italic
constant.character.entity, punctuation.definition.entity#AB6526
meta.selector, meta.selector entity, meta.selector entity punctuation, entity.name.tag.css#7A3E9D
meta.property-name, support.type.property-name#D10101DE
meta.property-value, meta.property-value constant.other, support.constant.property-value#42B415
keyword.other.important#BD43BDbold
markup.changed#000000
markup.deleted#000000
markup.italicitalic
markup.error#660000
markup.inserted#000000
meta.link#4B83CD
markup.output, markup.raw#777777
markup.prompt#777777
markup.heading#AA3731
markup.boldbold
markup.traceback#660000
markup.underlineunderline
markup.quote#7A3E9D
markup.list#4B83CD
markup.bold, markup.italic#448C27
markup.inline.raw#AB6526
meta.diff.range, meta.diff.index, meta.separator#434343
meta.diff.header.from-file#434343
meta.diff.header.to-file#434343
token.info-token#316BCD
token.warn-token#CD9731
token.error-token#CD3131
token.debug-token#800080
ImperialTheme by Asmodeus - VS Code Theme