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#101A1A
  • activityBar.border#ffffff15
  • activityBar.foreground#1F3B34
  • activityBar.inactiveForeground#F7F8FA60
  • activityBarBadge.background#1F3B34
  • activityBarBadge.foreground#101A1A
  • button.background#1F3B34
  • button.foreground#101A1A
  • button.hoverBackground#1F3B34dd
  • editor.background#101A1A
  • editor.foreground#F7F8FA
  • editor.inactiveSelectionBackground#B8A98F3580
  • editor.lineHighlightBackground#242E3440
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#B8A98F35
  • editorCursor.foreground#1F3B34
  • editorGroupHeader.tabsBackground#101A1Add
  • editorLineNumber.activeForeground#1F3B34
  • editorLineNumber.foreground#E8EAED80
  • focusBorder#1F3B34
  • foreground#F7F8FA
  • input.background#242E34
  • input.border#ffffff15
  • input.foreground#F7F8FA
  • input.placeholderForeground#F7F8FA60
  • list.activeSelectionBackground#1F3B3430
  • list.activeSelectionForeground#F7F8FA
  • list.highlightForeground#1F3B34
  • list.hoverBackground#242E3440
  • list.hoverForeground#F7F8FA
  • list.inactiveSelectionBackground#1F3B3415
  • list.inactiveSelectionForeground#F7F8FA
  • selection.background#B8A98F35
  • sideBar.background#242E34
  • sideBar.border#ffffff15
  • sideBar.foreground#F7F8FA
  • sideBarSectionHeader.background#101A1A80
  • sideBarSectionHeader.foreground#F7F8FA
  • sideBarTitle.foreground#1F3B34
  • statusBar.background#101A1A
  • statusBar.border#ffffff15
  • statusBar.foreground#F7F8FA
  • statusBar.noFolderBackground#101A1A
  • tab.activeBackground#101A1A
  • tab.activeBorderTop#1F3B34
  • tab.activeForeground#F7F8FA
  • tab.border#ffffff15
  • tab.inactiveBackground#242E3460
  • tab.inactiveForeground#F7F8FA80
  • terminal.ansiBlack#101A1A
  • terminal.ansiBlue#B8A98F
  • terminal.ansiCyan#D79A33
  • terminal.ansiGreen#1F3B34
  • terminal.ansiMagenta#C43A34
  • terminal.ansiRed#C43A34
  • terminal.ansiWhite#F7F8FA
  • terminal.ansiYellow#D79A33
  • terminal.background#101A1A
  • terminal.foreground#F7F8FA
  • titleBar.activeBackground#101A1A
  • titleBar.activeForeground#F7F8FA
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#101A1A
  • titleBar.inactiveForeground#F7F8FA60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#E8EAEDitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#B8A98Fbold
storage.type, storage.modifier#B8A98Fitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#1F3B34
string, punctuation.definition.string, string.template, meta.template.expression#D79A33
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#C43A34
variable, variable.other.readwrite, variable.other.object#F7F8FA
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F7F8FA
variable.parameter, meta.parameter#F7F8FAdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F7F8FA80
keyword.operator#F7F8FA
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#D79A33bold
entity.other.inherited-class#1F3B34
entity.name.tag, punctuation.definition.tag#B8A98F
entity.other.attribute-name#1F3B34
meta.diff, meta.diff.header#E8EAED
markup.deleted#C43A34
markup.inserted#1F3B34
markup.changed#D79A33
markup.heading, markup.heading.setext, punctuation.definition.heading#1F3B34bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#D79A33
string.other.link.title, string.other.link.description#1F3B34
markup.underline.link#E8EAEDunderline
punctuation.definition.list#B8A98F
markup.quote, punctuation.definition.quote#E8EAEDitalic
Morphous Theme by Ameyanagi - VS Code Theme