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.background#141B2D
  • activityBar.border#ffffff15
  • activityBar.foreground#1A237E
  • activityBar.inactiveForeground#F4F7F860
  • activityBarBadge.background#1A237E
  • activityBarBadge.foreground#141B2D
  • button.background#1A237E
  • button.foreground#141B2D
  • button.hoverBackground#1A237Edd
  • editor.background#141B2D
  • editor.foreground#F4F7F8
  • editor.inactiveSelectionBackground#293D993580
  • editor.lineHighlightBackground#0B122040
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#293D9935
  • editorCursor.foreground#1A237E
  • editorGroupHeader.tabsBackground#141B2Ddd
  • editorLineNumber.activeForeground#1A237E
  • editorLineNumber.foreground#D8E2EC80
  • focusBorder#1A237E
  • foreground#F4F7F8
  • input.background#0B1220
  • input.border#ffffff15
  • input.foreground#F4F7F8
  • input.placeholderForeground#F4F7F860
  • list.activeSelectionBackground#1A237E30
  • list.activeSelectionForeground#F4F7F8
  • list.highlightForeground#1A237E
  • list.hoverBackground#0B122040
  • list.hoverForeground#F4F7F8
  • list.inactiveSelectionBackground#1A237E15
  • list.inactiveSelectionForeground#F4F7F8
  • selection.background#293D9935
  • sideBar.background#0B1220
  • sideBar.border#ffffff15
  • sideBar.foreground#F4F7F8
  • sideBarSectionHeader.background#141B2D80
  • sideBarSectionHeader.foreground#F4F7F8
  • sideBarTitle.foreground#1A237E
  • statusBar.background#141B2D
  • statusBar.border#ffffff15
  • statusBar.foreground#F4F7F8
  • statusBar.noFolderBackground#141B2D
  • tab.activeBackground#141B2D
  • tab.activeBorderTop#1A237E
  • tab.activeForeground#F4F7F8
  • tab.border#ffffff15
  • tab.inactiveBackground#0B122060
  • tab.inactiveForeground#F4F7F880
  • terminal.ansiBlack#141B2D
  • terminal.ansiBlue#293D99
  • terminal.ansiCyan#00B8D9
  • terminal.ansiGreen#1A237E
  • terminal.ansiMagenta#22D3EE
  • terminal.ansiRed#22D3EE
  • terminal.ansiWhite#F4F7F8
  • terminal.ansiYellow#00B8D9
  • terminal.background#141B2D
  • terminal.foreground#F4F7F8
  • titleBar.activeBackground#141B2D
  • titleBar.activeForeground#F4F7F8
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#141B2D
  • titleBar.inactiveForeground#F4F7F860
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#D8E2ECitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#293D99bold
storage.type, storage.modifier#293D99italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#1A237E
string, punctuation.definition.string, string.template, meta.template.expression#00B8D9
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#22D3EE
variable, variable.other.readwrite, variable.other.object#F4F7F8
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F4F7F8
variable.parameter, meta.parameter#F4F7F8dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F4F7F880
keyword.operator#F4F7F8
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#00B8D9bold
entity.other.inherited-class#1A237E
entity.name.tag, punctuation.definition.tag#293D99
entity.other.attribute-name#1A237E
meta.diff, meta.diff.header#D8E2EC
markup.deleted#22D3EE
markup.inserted#1A237E
markup.changed#00B8D9
markup.heading, markup.heading.setext, punctuation.definition.heading#1A237Ebold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#00B8D9
string.other.link.title, string.other.link.description#1A237E
markup.underline.link#D8E2ECunderline
punctuation.definition.list#293D99
markup.quote, punctuation.definition.quote#D8E2ECitalic