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#071C27
  • activityBar.border#ffffff15
  • activityBar.foreground#67CDE9
  • activityBar.inactiveForeground#f7fafd60
  • activityBarBadge.background#67CDE9
  • activityBarBadge.foreground#071C27
  • button.background#67CDE9
  • button.foreground#071C27
  • button.hoverBackground#67CDE9dd
  • editor.background#071C27
  • editor.foreground#f7fafd
  • editor.inactiveSelectionBackground#79C0EC3580
  • editor.lineHighlightBackground#18202A40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#79C0EC35
  • editorCursor.foreground#67CDE9
  • editorGroupHeader.tabsBackground#071C27dd
  • editorLineNumber.activeForeground#67CDE9
  • editorLineNumber.foreground#f0f4f880
  • focusBorder#67CDE9
  • foreground#f7fafd
  • input.background#18202A
  • input.border#ffffff15
  • input.foreground#f7fafd
  • input.placeholderForeground#f7fafd60
  • list.activeSelectionBackground#67CDE930
  • list.activeSelectionForeground#f7fafd
  • list.highlightForeground#67CDE9
  • list.hoverBackground#18202A40
  • list.hoverForeground#f7fafd
  • list.inactiveSelectionBackground#67CDE915
  • list.inactiveSelectionForeground#f7fafd
  • selection.background#79C0EC35
  • sideBar.background#18202A
  • sideBar.border#ffffff15
  • sideBar.foreground#f7fafd
  • sideBarSectionHeader.background#071C2780
  • sideBarSectionHeader.foreground#f7fafd
  • sideBarTitle.foreground#67CDE9
  • statusBar.background#071C27
  • statusBar.border#ffffff15
  • statusBar.foreground#f7fafd
  • statusBar.noFolderBackground#071C27
  • tab.activeBackground#071C27
  • tab.activeBorderTop#67CDE9
  • tab.activeForeground#f7fafd
  • tab.border#ffffff15
  • tab.inactiveBackground#18202A60
  • tab.inactiveForeground#f7fafd80
  • terminal.ansiBlack#071C27
  • terminal.ansiBlue#79C0EC
  • terminal.ansiCyan#55CAE7
  • terminal.ansiGreen#67CDE9
  • terminal.ansiMagenta#F18383
  • terminal.ansiRed#F18383
  • terminal.ansiWhite#f7fafd
  • terminal.ansiYellow#55CAE7
  • terminal.background#071C27
  • terminal.foreground#f7fafd
  • titleBar.activeBackground#071C27
  • titleBar.activeForeground#f7fafd
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#071C27
  • titleBar.inactiveForeground#f7fafd60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#f0f4f8italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#79C0ECbold
storage.type, storage.modifier#79C0ECitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#67CDE9
string, punctuation.definition.string, string.template, meta.template.expression#55CAE7
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#F18383
variable, variable.other.readwrite, variable.other.object#f7fafd
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#f7fafd
variable.parameter, meta.parameter#f7fafddditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#f7fafd80
keyword.operator#f7fafd
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#55CAE7bold
entity.other.inherited-class#67CDE9
entity.name.tag, punctuation.definition.tag#79C0EC
entity.other.attribute-name#67CDE9
meta.diff, meta.diff.header#f0f4f8
markup.deleted#F18383
markup.inserted#67CDE9
markup.changed#55CAE7
markup.heading, markup.heading.setext, punctuation.definition.heading#67CDE9bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#55CAE7
string.other.link.title, string.other.link.description#67CDE9
markup.underline.link#f0f4f8underline
punctuation.definition.list#79C0EC
markup.quote, punctuation.definition.quote#f0f4f8italic