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#2A3370
  • activityBar.border#ffffff15
  • activityBar.foreground#3F4EA1
  • activityBar.inactiveForeground#FAF7EF60
  • activityBarBadge.background#3F4EA1
  • activityBarBadge.foreground#2A3370
  • button.background#3F4EA1
  • button.foreground#2A3370
  • button.hoverBackground#3F4EA1dd
  • editor.background#2A3370
  • editor.foreground#FAF7EF
  • editor.inactiveSelectionBackground#E7EEF73580
  • editor.lineHighlightBackground#1F243340
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#E7EEF735
  • editorCursor.foreground#3F4EA1
  • editorGroupHeader.tabsBackground#2A3370dd
  • editorLineNumber.activeForeground#3F4EA1
  • editorLineNumber.foreground#D6C8B880
  • focusBorder#3F4EA1
  • foreground#FAF7EF
  • input.background#1F2433
  • input.border#ffffff15
  • input.foreground#FAF7EF
  • input.placeholderForeground#FAF7EF60
  • list.activeSelectionBackground#3F4EA130
  • list.activeSelectionForeground#FAF7EF
  • list.highlightForeground#3F4EA1
  • list.hoverBackground#1F243340
  • list.hoverForeground#FAF7EF
  • list.inactiveSelectionBackground#3F4EA115
  • list.inactiveSelectionForeground#FAF7EF
  • selection.background#E7EEF735
  • sideBar.background#1F2433
  • sideBar.border#ffffff15
  • sideBar.foreground#FAF7EF
  • sideBarSectionHeader.background#2A337080
  • sideBarSectionHeader.foreground#FAF7EF
  • sideBarTitle.foreground#3F4EA1
  • statusBar.background#2A3370
  • statusBar.border#ffffff15
  • statusBar.foreground#FAF7EF
  • statusBar.noFolderBackground#2A3370
  • tab.activeBackground#2A3370
  • tab.activeBorderTop#3F4EA1
  • tab.activeForeground#FAF7EF
  • tab.border#ffffff15
  • tab.inactiveBackground#1F243360
  • tab.inactiveForeground#FAF7EF80
  • terminal.ansiBlack#2A3370
  • terminal.ansiBlue#E7EEF7
  • terminal.ansiCyan#6C8E6A
  • terminal.ansiGreen#3F4EA1
  • terminal.ansiMagenta#8A6A52
  • terminal.ansiRed#8A6A52
  • terminal.ansiWhite#FAF7EF
  • terminal.ansiYellow#6C8E6A
  • terminal.background#2A3370
  • terminal.foreground#FAF7EF
  • titleBar.activeBackground#2A3370
  • titleBar.activeForeground#FAF7EF
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#2A3370
  • titleBar.inactiveForeground#FAF7EF60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#D6C8B8italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#E7EEF7bold
storage.type, storage.modifier#E7EEF7italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#3F4EA1
string, punctuation.definition.string, string.template, meta.template.expression#6C8E6A
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#8A6A52
variable, variable.other.readwrite, variable.other.object#FAF7EF
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#FAF7EF
variable.parameter, meta.parameter#FAF7EFdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#FAF7EF80
keyword.operator#FAF7EF
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#6C8E6Abold
entity.other.inherited-class#3F4EA1
entity.name.tag, punctuation.definition.tag#E7EEF7
entity.other.attribute-name#3F4EA1
meta.diff, meta.diff.header#D6C8B8
markup.deleted#8A6A52
markup.inserted#3F4EA1
markup.changed#6C8E6A
markup.heading, markup.heading.setext, punctuation.definition.heading#3F4EA1bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#6C8E6A
string.other.link.title, string.other.link.description#3F4EA1
markup.underline.link#D6C8B8underline
punctuation.definition.list#E7EEF7
markup.quote, punctuation.definition.quote#D6C8B8italic
Morphous Theme by Ameyanagi - VS Code Theme