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#f6f7f4
  • activityBar.border#00000015
  • activityBar.foreground#6fa9d6
  • activityBar.inactiveForeground#0a0d1260
  • activityBarBadge.background#6fa9d6
  • activityBarBadge.foreground#f6f7f4
  • button.background#6fa9d6
  • button.foreground#f6f7f4
  • button.hoverBackground#6fa9d6dd
  • editor.background#f6f7f4
  • editor.foreground#0a0d12
  • editor.inactiveSelectionBackground#2e5b7f2580
  • editor.lineHighlightBackground#f2efe650
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#2e5b7f25
  • editorCursor.foreground#6fa9d6
  • editorGroupHeader.tabsBackground#f2efe6aa
  • editorLineNumber.activeForeground#6fa9d6
  • editorLineNumber.foreground#c7ccd680
  • focusBorder#6fa9d6
  • foreground#0a0d12
  • input.background#f2efe6
  • input.border#00000015
  • input.foreground#0a0d12
  • input.placeholderForeground#0a0d1260
  • list.activeSelectionBackground#6fa9d630
  • list.activeSelectionForeground#0a0d12
  • list.highlightForeground#6fa9d6
  • list.hoverBackground#f2efe640
  • list.hoverForeground#0a0d12
  • list.inactiveSelectionBackground#6fa9d615
  • list.inactiveSelectionForeground#0a0d12
  • selection.background#2e5b7f25
  • sideBar.background#f2efe6
  • sideBar.border#00000015
  • sideBar.foreground#0a0d12
  • sideBarSectionHeader.background#f2efe680
  • sideBarSectionHeader.foreground#0a0d12
  • sideBarTitle.foreground#6fa9d6
  • statusBar.background#f6f7f4
  • statusBar.border#00000015
  • statusBar.foreground#0a0d12
  • statusBar.noFolderBackground#f6f7f4
  • tab.activeBackground#f6f7f4
  • tab.activeBorderTop#6fa9d6
  • tab.activeForeground#0a0d12
  • tab.border#00000015
  • tab.inactiveBackground#f6f7f460
  • tab.inactiveForeground#0a0d1280
  • terminal.ansiBlack#0a0d12
  • terminal.ansiBlue#2e5b7f
  • terminal.ansiCyan#8fd3da
  • terminal.ansiGreen#6fa9d6
  • terminal.ansiMagenta#0a0d12
  • terminal.ansiRed#0a0d12
  • terminal.ansiWhite#0a0d12
  • terminal.ansiYellow#8fd3da
  • terminal.background#f6f7f4
  • terminal.foreground#0a0d12
  • titleBar.activeBackground#f6f7f4
  • titleBar.activeForeground#0a0d12
  • titleBar.border#00000015
  • titleBar.inactiveBackground#f6f7f4
  • titleBar.inactiveForeground#0a0d1260
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#c7ccd6italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#2e5b7fbold
storage.type, storage.modifier#2e5b7fitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#6fa9d6
string, punctuation.definition.string, string.template, meta.template.expression#8fd3da
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#0a0d12
variable, variable.other.readwrite, variable.other.object#0a0d12
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#0a0d12
variable.parameter, meta.parameter#0a0d12dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#0a0d1280
keyword.operator#0a0d12
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#8fd3dabold
entity.other.inherited-class#6fa9d6
entity.name.tag, punctuation.definition.tag#2e5b7f
entity.other.attribute-name#6fa9d6
meta.diff, meta.diff.header#c7ccd6
markup.deleted#0a0d12
markup.inserted#6fa9d6
markup.changed#8fd3da
markup.heading, markup.heading.setext, punctuation.definition.heading#6fa9d6bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#8fd3da
string.other.link.title, string.other.link.description#6fa9d6
markup.underline.link#c7ccd6underline
punctuation.definition.list#2e5b7f
markup.quote, punctuation.definition.quote#c7ccd6italic
Morphous Theme by Ameyanagi - VS Code Theme