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#182D40
  • activityBar.border#ffffff15
  • activityBar.foreground#4EA3FF
  • activityBar.inactiveForeground#F8FCFF60
  • activityBarBadge.background#4EA3FF
  • activityBarBadge.foreground#182D40
  • button.background#4EA3FF
  • button.foreground#182D40
  • button.hoverBackground#4EA3FFdd
  • editor.background#182D40
  • editor.foreground#F8FCFF
  • editor.inactiveSelectionBackground#1F4D8F3580
  • editor.lineHighlightBackground#0D182240
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#1F4D8F35
  • editorCursor.foreground#4EA3FF
  • editorGroupHeader.tabsBackground#182D40dd
  • editorLineNumber.activeForeground#4EA3FF
  • editorLineNumber.foreground#A09B8C80
  • focusBorder#4EA3FF
  • foreground#F8FCFF
  • input.background#0D1822
  • input.border#ffffff15
  • input.foreground#F8FCFF
  • input.placeholderForeground#F8FCFF60
  • list.activeSelectionBackground#4EA3FF30
  • list.activeSelectionForeground#F8FCFF
  • list.highlightForeground#4EA3FF
  • list.hoverBackground#0D182240
  • list.hoverForeground#F8FCFF
  • list.inactiveSelectionBackground#4EA3FF15
  • list.inactiveSelectionForeground#F8FCFF
  • selection.background#1F4D8F35
  • sideBar.background#0D1822
  • sideBar.border#ffffff15
  • sideBar.foreground#F8FCFF
  • sideBarSectionHeader.background#182D4080
  • sideBarSectionHeader.foreground#F8FCFF
  • sideBarTitle.foreground#4EA3FF
  • statusBar.background#182D40
  • statusBar.border#ffffff15
  • statusBar.foreground#F8FCFF
  • statusBar.noFolderBackground#182D40
  • tab.activeBackground#182D40
  • tab.activeBorderTop#4EA3FF
  • tab.activeForeground#F8FCFF
  • tab.border#ffffff15
  • tab.inactiveBackground#0D182260
  • tab.inactiveForeground#F8FCFF80
  • terminal.ansiBlack#182D40
  • terminal.ansiBlue#1F4D8F
  • terminal.ansiCyan#6AAB4F
  • terminal.ansiGreen#4EA3FF
  • terminal.ansiMagenta#7FD6E6
  • terminal.ansiRed#7FD6E6
  • terminal.ansiWhite#F8FCFF
  • terminal.ansiYellow#6AAB4F
  • terminal.background#182D40
  • terminal.foreground#F8FCFF
  • titleBar.activeBackground#182D40
  • titleBar.activeForeground#F8FCFF
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#182D40
  • titleBar.inactiveForeground#F8FCFF60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#A09B8Citalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#1F4D8Fbold
storage.type, storage.modifier#1F4D8Fitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#4EA3FF
string, punctuation.definition.string, string.template, meta.template.expression#6AAB4F
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#7FD6E6
variable, variable.other.readwrite, variable.other.object#F8FCFF
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F8FCFF
variable.parameter, meta.parameter#F8FCFFdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F8FCFF80
keyword.operator#F8FCFF
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#6AAB4Fbold
entity.other.inherited-class#4EA3FF
entity.name.tag, punctuation.definition.tag#1F4D8F
entity.other.attribute-name#4EA3FF
meta.diff, meta.diff.header#A09B8C
markup.deleted#7FD6E6
markup.inserted#4EA3FF
markup.changed#6AAB4F
markup.heading, markup.heading.setext, punctuation.definition.heading#4EA3FFbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#6AAB4F
string.other.link.title, string.other.link.description#4EA3FF
markup.underline.link#A09B8Cunderline
punctuation.definition.list#1F4D8F
markup.quote, punctuation.definition.quote#A09B8Citalic
Morphous Theme by Ameyanagi - VS Code Theme