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#F1F4F6
  • activityBar.border#00000015
  • activityBar.foreground#0D0D0F
  • activityBar.inactiveForeground#0D0D0F60
  • activityBarBadge.background#0D0D0F
  • activityBarBadge.foreground#F1F4F6
  • button.background#0D0D0F
  • button.foreground#F1F4F6
  • button.hoverBackground#0D0D0Fdd
  • editor.background#F1F4F6
  • editor.foreground#0D0D0F
  • editor.inactiveSelectionBackground#C2482A2580
  • editor.lineHighlightBackground#ffffff50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#C2482A25
  • editorCursor.foreground#0D0D0F
  • editorGroupHeader.tabsBackground#ffffffaa
  • editorLineNumber.activeForeground#0D0D0F
  • editorLineNumber.foreground#E5E7EB80
  • focusBorder#0D0D0F
  • foreground#0D0D0F
  • input.background#ffffff
  • input.border#00000015
  • input.foreground#0D0D0F
  • input.placeholderForeground#0D0D0F60
  • list.activeSelectionBackground#0D0D0F30
  • list.activeSelectionForeground#0D0D0F
  • list.highlightForeground#0D0D0F
  • list.hoverBackground#ffffff40
  • list.hoverForeground#0D0D0F
  • list.inactiveSelectionBackground#0D0D0F15
  • list.inactiveSelectionForeground#0D0D0F
  • selection.background#C2482A25
  • sideBar.background#ffffff
  • sideBar.border#00000015
  • sideBar.foreground#0D0D0F
  • sideBarSectionHeader.background#ffffff80
  • sideBarSectionHeader.foreground#0D0D0F
  • sideBarTitle.foreground#0D0D0F
  • statusBar.background#F1F4F6
  • statusBar.border#00000015
  • statusBar.foreground#0D0D0F
  • statusBar.noFolderBackground#F1F4F6
  • tab.activeBackground#F1F4F6
  • tab.activeBorderTop#0D0D0F
  • tab.activeForeground#0D0D0F
  • tab.border#00000015
  • tab.inactiveBackground#F1F4F660
  • tab.inactiveForeground#0D0D0F80
  • terminal.ansiBlack#0D0D0F
  • terminal.ansiBlue#C2482A
  • terminal.ansiCyan#8FB7D6
  • terminal.ansiGreen#0D0D0F
  • terminal.ansiMagenta#E07A5F
  • terminal.ansiRed#E07A5F
  • terminal.ansiWhite#0D0D0F
  • terminal.ansiYellow#8FB7D6
  • terminal.background#F1F4F6
  • terminal.foreground#0D0D0F
  • titleBar.activeBackground#F1F4F6
  • titleBar.activeForeground#0D0D0F
  • titleBar.border#00000015
  • titleBar.inactiveBackground#F1F4F6
  • titleBar.inactiveForeground#0D0D0F60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#E5E7EBitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#C2482Abold
storage.type, storage.modifier#C2482Aitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#0D0D0F
string, punctuation.definition.string, string.template, meta.template.expression#8FB7D6
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#E07A5F
variable, variable.other.readwrite, variable.other.object#0D0D0F
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#0D0D0F
variable.parameter, meta.parameter#0D0D0Fdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#0D0D0F80
keyword.operator#0D0D0F
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#8FB7D6bold
entity.other.inherited-class#0D0D0F
entity.name.tag, punctuation.definition.tag#C2482A
entity.other.attribute-name#0D0D0F
meta.diff, meta.diff.header#E5E7EB
markup.deleted#E07A5F
markup.inserted#0D0D0F
markup.changed#8FB7D6
markup.heading, markup.heading.setext, punctuation.definition.heading#0D0D0Fbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#8FB7D6
string.other.link.title, string.other.link.description#0D0D0F
markup.underline.link#E5E7EBunderline
punctuation.definition.list#C2482A
markup.quote, punctuation.definition.quote#E5E7EBitalic
Morphous Theme by Ameyanagi - VS Code Theme