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#00F
  • activityBar.background#FFF
  • activityBar.foreground#00F
  • activityBar.inactiveForeground#000
  • activityBarBadge.background#00F
  • breadcrumb.background#FFF
  • editor.background#FFF
  • editor.foreground#000
  • editor.selectionBackground#0000FF55
  • editorBracketHighlight.foreground1#F44
  • editorBracketHighlight.foreground2#44F
  • editorBracketHighlight.foreground3#F44
  • editorBracketHighlight.foreground4#44F
  • editorBracketHighlight.foreground5#F44
  • editorBracketHighlight.foreground6#44F
  • editorGroupHeader.tabsBackground#FFF
  • editorGroupHeader.tabsBorder#FFF
  • editorWidget.background#FFF
  • editorWidget.foreground#000
  • gitDecoration.addedResourceForeground#0D0
  • gitDecoration.conflictingResourceForeground#F00
  • gitDecoration.deletedResourceForeground#F00
  • gitDecoration.ignoredResourceForeground#AAA
  • gitDecoration.modifiedResourceForeground#00F
  • gitDecoration.stageDeletedResourceForeground#F00
  • gitDecoration.stageModifiedResourceForeground#00F
  • gitDecoration.untrackedResourceForeground#FA0
  • input.background#FFF
  • input.foreground#000
  • list.activeSelectionBackground#0000FF55
  • list.activeSelectionForeground#000
  • list.hoverBackground#0000FF55
  • list.inactiveSelectionBackground#0000FF55
  • sideBar.background#FFF
  • sideBar.border#FFF
  • sideBarSectionHeader.background#FFF
  • sideBarSectionHeader.foreground#000
  • sideBarTitle.foreground#BBB
  • statusBar.background#FFF
  • statusBar.foreground#000
  • tab.activeBackground#FFF
  • tab.activeBorderTop#00F
  • tab.activeForeground#000
  • tab.border#FFF
  • tab.inactiveBackground#FFF
  • terminal.ansiBlack#000
  • terminal.ansiBlue#00F
  • terminal.ansiBrightBlack#444
  • terminal.ansiBrightBlue#44F
  • terminal.ansiBrightCyan#4DD
  • terminal.ansiBrightGreen#4D4
  • terminal.ansiBrightMagenta#F4F
  • terminal.ansiBrightRed#F44
  • terminal.ansiBrightWhite#FFF
  • terminal.ansiBrightYellow#FAA
  • terminal.ansiCyan#0DD
  • terminal.ansiGreen#0D0
  • terminal.ansiMagenta#F0F
  • terminal.ansiRed#F00
  • terminal.ansiWhite#AAA
  • terminal.ansiYellow#FA0
  • terminal.background#FFF
  • terminal.foreground#000
  • titleBar.activeBackground#FFF
  • titleBar.inactiveBackground#FFF

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#AAAitalic
comment.block.preprocessor#AAAitalic
comment.documentation, comment.block.documentation#AAAitalic
invalid.illegal#D00underline
keyword, storage, support.class, entity.name.class#F00
entity.name.type, support.type#000
constant.language, support.constant, variable.language#0D0
variable, entity, support.variable#00F
entity.name.function, support.function, entity.name.method#00F
entity.name.type, entity.other.inherited-class, support.class#000
entity.name.exception#F00
entity.name.sectionbold
constant.numeric, constant.character, constant#0D0
string#0D0
constant.character.escape#0D0
string.regexp#0D0
constant.other.symbol#0D0
punctuation#F00
meta.tag.sgml.doctype, meta.tag.sgml.doctype string, meta.tag.sgml.doctype entity.name.tag, meta.tag.sgml punctuation.definition.tag.html#AAA
meta.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html#F00
entity.name.tag#00F
meta.tag entity.other.attribute-name, entity.other.attribute-name.html#F00italic
constant.character.entity, punctuation.definition.entity#00F
meta.selector, meta.selector entity, meta.selector entity punctuation, entity.name.tag.css#F00
meta.property-name, support.type.property-name#00F
meta.property-value, meta.property-value constant.other, support.constant.property-value#F00
markup.changed#000
markup.deleted#000
markup.italicitalic
markup.error#F00
markup.inserted#000
meta.link#0D0
markup.output, markup.raw#777
markup.prompt#F00
markup.heading#F00
markup.boldbold
markup.traceback#00F
markup.underlineunderline
markup.quote#00F
markup.list#F00
markup.bold, markup.italic, markup.underline#00F
markup.inline.raw#00F
meta.diff.range, meta.diff.index, meta.separator#00F
meta.diff.header.from-file#0D0
meta.diff.header.to-file#F00