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#FCFCFD
  • activityBar.border#00000015
  • activityBar.foreground#259391
  • activityBar.inactiveForeground#0F1A1D60
  • activityBarBadge.background#259391
  • activityBarBadge.foreground#FCFCFD
  • button.background#259391
  • button.foreground#FCFCFD
  • button.hoverBackground#259391dd
  • editor.background#FCFCFD
  • editor.foreground#0F1A1D
  • editor.inactiveSelectionBackground#2183772580
  • editor.lineHighlightBackground#F0F2F550
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#21837725
  • editorCursor.foreground#259391
  • editorGroupHeader.tabsBackground#F0F2F5aa
  • editorLineNumber.activeForeground#259391
  • editorLineNumber.foreground#9BA8AA80
  • focusBorder#259391
  • foreground#0F1A1D
  • input.background#F0F2F5
  • input.border#00000015
  • input.foreground#0F1A1D
  • input.placeholderForeground#0F1A1D60
  • list.activeSelectionBackground#25939130
  • list.activeSelectionForeground#0F1A1D
  • list.highlightForeground#259391
  • list.hoverBackground#F0F2F540
  • list.hoverForeground#0F1A1D
  • list.inactiveSelectionBackground#25939115
  • list.inactiveSelectionForeground#0F1A1D
  • selection.background#21837725
  • sideBar.background#F0F2F5
  • sideBar.border#00000015
  • sideBar.foreground#0F1A1D
  • sideBarSectionHeader.background#F0F2F580
  • sideBarSectionHeader.foreground#0F1A1D
  • sideBarTitle.foreground#259391
  • statusBar.background#FCFCFD
  • statusBar.border#00000015
  • statusBar.foreground#0F1A1D
  • statusBar.noFolderBackground#FCFCFD
  • tab.activeBackground#FCFCFD
  • tab.activeBorderTop#259391
  • tab.activeForeground#0F1A1D
  • tab.border#00000015
  • tab.inactiveBackground#FCFCFD60
  • tab.inactiveForeground#0F1A1D80
  • terminal.ansiBlack#0F1A1D
  • terminal.ansiBlue#218377
  • terminal.ansiCyan#A32941
  • terminal.ansiGreen#259391
  • terminal.ansiMagenta#764E19
  • terminal.ansiRed#764E19
  • terminal.ansiWhite#0F1A1D
  • terminal.ansiYellow#A32941
  • terminal.background#FCFCFD
  • terminal.foreground#0F1A1D
  • titleBar.activeBackground#FCFCFD
  • titleBar.activeForeground#0F1A1D
  • titleBar.border#00000015
  • titleBar.inactiveBackground#FCFCFD
  • titleBar.inactiveForeground#0F1A1D60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#9BA8AAitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#218377bold
storage.type, storage.modifier#218377italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#259391
string, punctuation.definition.string, string.template, meta.template.expression#A32941
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#764E19
variable, variable.other.readwrite, variable.other.object#0F1A1D
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#0F1A1D
variable.parameter, meta.parameter#0F1A1Ddditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#0F1A1D80
keyword.operator#0F1A1D
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#A32941bold
entity.other.inherited-class#259391
entity.name.tag, punctuation.definition.tag#218377
entity.other.attribute-name#259391
meta.diff, meta.diff.header#9BA8AA
markup.deleted#764E19
markup.inserted#259391
markup.changed#A32941
markup.heading, markup.heading.setext, punctuation.definition.heading#259391bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#A32941
string.other.link.title, string.other.link.description#259391
markup.underline.link#9BA8AAunderline
punctuation.definition.list#218377
markup.quote, punctuation.definition.quote#9BA8AAitalic
Morphous Theme by Ameyanagi - VS Code Theme