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#0B0B0F
  • activityBar.border#ffffff15
  • activityBar.foreground#0D47FF
  • activityBar.inactiveForeground#F7FCFF60
  • activityBarBadge.background#0D47FF
  • activityBarBadge.foreground#0B0B0F
  • button.background#0D47FF
  • button.foreground#0B0B0F
  • button.hoverBackground#0D47FFdd
  • editor.background#0B0B0F
  • editor.foreground#F7FCFF
  • editor.inactiveSelectionBackground#FFD6003580
  • editor.lineHighlightBackground#00102640
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#FFD60035
  • editorCursor.foreground#0D47FF
  • editorGroupHeader.tabsBackground#0B0B0Fdd
  • editorLineNumber.activeForeground#0D47FF
  • editorLineNumber.foreground#CFFAFA80
  • focusBorder#0D47FF
  • foreground#F7FCFF
  • input.background#001026
  • input.border#ffffff15
  • input.foreground#F7FCFF
  • input.placeholderForeground#F7FCFF60
  • list.activeSelectionBackground#0D47FF30
  • list.activeSelectionForeground#F7FCFF
  • list.highlightForeground#0D47FF
  • list.hoverBackground#00102640
  • list.hoverForeground#F7FCFF
  • list.inactiveSelectionBackground#0D47FF15
  • list.inactiveSelectionForeground#F7FCFF
  • selection.background#FFD60035
  • sideBar.background#001026
  • sideBar.border#ffffff15
  • sideBar.foreground#F7FCFF
  • sideBarSectionHeader.background#0B0B0F80
  • sideBarSectionHeader.foreground#F7FCFF
  • sideBarTitle.foreground#0D47FF
  • statusBar.background#0B0B0F
  • statusBar.border#ffffff15
  • statusBar.foreground#F7FCFF
  • statusBar.noFolderBackground#0B0B0F
  • tab.activeBackground#0B0B0F
  • tab.activeBorderTop#0D47FF
  • tab.activeForeground#F7FCFF
  • tab.border#ffffff15
  • tab.inactiveBackground#00102660
  • tab.inactiveForeground#F7FCFF80
  • terminal.ansiBlack#0B0B0F
  • terminal.ansiBlue#FFD600
  • terminal.ansiCyan#00B5B8
  • terminal.ansiGreen#0D47FF
  • terminal.ansiMagenta#22D3EE
  • terminal.ansiRed#22D3EE
  • terminal.ansiWhite#F7FCFF
  • terminal.ansiYellow#00B5B8
  • terminal.background#0B0B0F
  • terminal.foreground#F7FCFF
  • titleBar.activeBackground#0B0B0F
  • titleBar.activeForeground#F7FCFF
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#0B0B0F
  • titleBar.inactiveForeground#F7FCFF60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#CFFAFAitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#FFD600bold
storage.type, storage.modifier#FFD600italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#0D47FF
string, punctuation.definition.string, string.template, meta.template.expression#00B5B8
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#22D3EE
variable, variable.other.readwrite, variable.other.object#F7FCFF
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F7FCFF
variable.parameter, meta.parameter#F7FCFFdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F7FCFF80
keyword.operator#F7FCFF
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#00B5B8bold
entity.other.inherited-class#0D47FF
entity.name.tag, punctuation.definition.tag#FFD600
entity.other.attribute-name#0D47FF
meta.diff, meta.diff.header#CFFAFA
markup.deleted#22D3EE
markup.inserted#0D47FF
markup.changed#00B5B8
markup.heading, markup.heading.setext, punctuation.definition.heading#0D47FFbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#00B5B8
string.other.link.title, string.other.link.description#0D47FF
markup.underline.link#CFFAFAunderline
punctuation.definition.list#FFD600
markup.quote, punctuation.definition.quote#CFFAFAitalic
Morphous Theme by Ameyanagi - VS Code Theme