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#FBFCFD
  • activityBar.border#00000015
  • activityBar.foreground#253E93
  • activityBar.inactiveForeground#0f172a60
  • activityBarBadge.background#253E93
  • activityBarBadge.foreground#FBFCFD
  • button.background#253E93
  • button.foreground#FBFCFD
  • button.hoverBackground#253E93dd
  • editor.background#FBFCFD
  • editor.foreground#0f172a
  • editor.inactiveSelectionBackground#2140832580
  • editor.lineHighlightBackground#F7F7F750
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#21408325
  • editorCursor.foreground#253E93
  • editorGroupHeader.tabsBackground#F7F7F7aa
  • editorLineNumber.activeForeground#253E93
  • editorLineNumber.foreground#64748b80
  • focusBorder#253E93
  • foreground#0f172a
  • input.background#F7F7F7
  • input.border#00000015
  • input.foreground#0f172a
  • input.placeholderForeground#0f172a60
  • list.activeSelectionBackground#253E9330
  • list.activeSelectionForeground#0f172a
  • list.highlightForeground#253E93
  • list.hoverBackground#F7F7F740
  • list.hoverForeground#0f172a
  • list.inactiveSelectionBackground#253E9315
  • list.inactiveSelectionForeground#0f172a
  • selection.background#21408325
  • sideBar.background#F7F7F7
  • sideBar.border#00000015
  • sideBar.foreground#0f172a
  • sideBarSectionHeader.background#F7F7F780
  • sideBarSectionHeader.foreground#0f172a
  • sideBarTitle.foreground#253E93
  • statusBar.background#FBFCFD
  • statusBar.border#00000015
  • statusBar.foreground#0f172a
  • statusBar.noFolderBackground#FBFCFD
  • tab.activeBackground#FBFCFD
  • tab.activeBorderTop#253E93
  • tab.activeForeground#0f172a
  • tab.border#00000015
  • tab.inactiveBackground#FBFCFD60
  • tab.inactiveForeground#0f172a80
  • terminal.ansiBlack#0f172a
  • terminal.ansiBlue#214083
  • terminal.ansiCyan#2F29A3
  • terminal.ansiGreen#253E93
  • terminal.ansiMagenta#3B1976
  • terminal.ansiRed#3B1976
  • terminal.ansiWhite#0f172a
  • terminal.ansiYellow#2F29A3
  • terminal.background#FBFCFD
  • terminal.foreground#0f172a
  • titleBar.activeBackground#FBFCFD
  • titleBar.activeForeground#0f172a
  • titleBar.border#00000015
  • titleBar.inactiveBackground#FBFCFD
  • titleBar.inactiveForeground#0f172a60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#64748bitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#214083bold
storage.type, storage.modifier#214083italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#253E93
string, punctuation.definition.string, string.template, meta.template.expression#2F29A3
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#3B1976
variable, variable.other.readwrite, variable.other.object#0f172a
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#0f172a
variable.parameter, meta.parameter#0f172additalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#0f172a80
keyword.operator#0f172a
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#2F29A3bold
entity.other.inherited-class#253E93
entity.name.tag, punctuation.definition.tag#214083
entity.other.attribute-name#253E93
meta.diff, meta.diff.header#64748b
markup.deleted#3B1976
markup.inserted#253E93
markup.changed#2F29A3
markup.heading, markup.heading.setext, punctuation.definition.heading#253E93bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#2F29A3
string.other.link.title, string.other.link.description#253E93
markup.underline.link#64748bunderline
punctuation.definition.list#214083
markup.quote, punctuation.definition.quote#64748bitalic
Morphous Theme by Ameyanagi - VS Code Theme