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#364E3A
  • activityBar.border#ffffff15
  • activityBar.foreground#67E9AF
  • activityBar.inactiveForeground#FAF7EF60
  • activityBarBadge.background#67E9AF
  • activityBarBadge.foreground#364E3A
  • button.background#67E9AF
  • button.foreground#364E3A
  • button.hoverBackground#67E9AFdd
  • editor.background#364E3A
  • editor.foreground#FAF7EF
  • editor.inactiveSelectionBackground#79EC833580
  • editor.lineHighlightBackground#0A0A0A40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#79EC8335
  • editorCursor.foreground#67E9AF
  • editorGroupHeader.tabsBackground#364E3Add
  • editorLineNumber.activeForeground#67E9AF
  • editorLineNumber.foreground#5B5A5280
  • focusBorder#67E9AF
  • foreground#FAF7EF
  • input.background#0A0A0A
  • input.border#ffffff15
  • input.foreground#FAF7EF
  • input.placeholderForeground#FAF7EF60
  • list.activeSelectionBackground#67E9AF30
  • list.activeSelectionForeground#FAF7EF
  • list.highlightForeground#67E9AF
  • list.hoverBackground#0A0A0A40
  • list.hoverForeground#FAF7EF
  • list.inactiveSelectionBackground#67E9AF15
  • list.inactiveSelectionForeground#FAF7EF
  • selection.background#79EC8335
  • sideBar.background#0A0A0A
  • sideBar.border#ffffff15
  • sideBar.foreground#FAF7EF
  • sideBarSectionHeader.background#364E3A80
  • sideBarSectionHeader.foreground#FAF7EF
  • sideBarTitle.foreground#67E9AF
  • statusBar.background#364E3A
  • statusBar.border#ffffff15
  • statusBar.foreground#FAF7EF
  • statusBar.noFolderBackground#364E3A
  • tab.activeBackground#364E3A
  • tab.activeBorderTop#67E9AF
  • tab.activeForeground#FAF7EF
  • tab.border#ffffff15
  • tab.inactiveBackground#0A0A0A60
  • tab.inactiveForeground#FAF7EF80
  • terminal.ansiBlack#364E3A
  • terminal.ansiBlue#79EC83
  • terminal.ansiCyan#E7C555
  • terminal.ansiGreen#67E9AF
  • terminal.ansiMagenta#F18783
  • terminal.ansiRed#F18783
  • terminal.ansiWhite#FAF7EF
  • terminal.ansiYellow#E7C555
  • terminal.background#364E3A
  • terminal.foreground#FAF7EF
  • titleBar.activeBackground#364E3A
  • titleBar.activeForeground#FAF7EF
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#364E3A
  • titleBar.inactiveForeground#FAF7EF60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#5B5A52italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#79EC83bold
storage.type, storage.modifier#79EC83italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#67E9AF
string, punctuation.definition.string, string.template, meta.template.expression#E7C555
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#F18783
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#E7C555bold
entity.other.inherited-class#67E9AF
entity.name.tag, punctuation.definition.tag#79EC83
entity.other.attribute-name#67E9AF
meta.diff, meta.diff.header#5B5A52
markup.deleted#F18783
markup.inserted#67E9AF
markup.changed#E7C555
markup.heading, markup.heading.setext, punctuation.definition.heading#67E9AFbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#E7C555
string.other.link.title, string.other.link.description#67E9AF
markup.underline.link#5B5A52underline
punctuation.definition.list#79EC83
markup.quote, punctuation.definition.quote#5B5A52italic
Morphous Theme by Ameyanagi - VS Code Theme