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#FBFAF8
  • activityBar.border#00000015
  • activityBar.foreground#3C7F72
  • activityBar.inactiveForeground#2C333360
  • activityBarBadge.background#3C7F72
  • activityBarBadge.foreground#FBFAF8
  • button.background#3C7F72
  • button.foreground#FBFAF8
  • button.hoverBackground#3C7F72dd
  • editor.background#FBFAF8
  • editor.foreground#2C3333
  • editor.inactiveSelectionBackground#B9B1A72580
  • editor.lineHighlightBackground#D9D6D250
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#B9B1A725
  • editorCursor.foreground#3C7F72
  • editorGroupHeader.tabsBackground#D9D6D2aa
  • editorLineNumber.activeForeground#3C7F72
  • editorLineNumber.foreground#7B6A7480
  • focusBorder#3C7F72
  • foreground#2C3333
  • input.background#D9D6D2
  • input.border#00000015
  • input.foreground#2C3333
  • input.placeholderForeground#2C333360
  • list.activeSelectionBackground#3C7F7230
  • list.activeSelectionForeground#2C3333
  • list.highlightForeground#3C7F72
  • list.hoverBackground#D9D6D240
  • list.hoverForeground#2C3333
  • list.inactiveSelectionBackground#3C7F7215
  • list.inactiveSelectionForeground#2C3333
  • selection.background#B9B1A725
  • sideBar.background#D9D6D2
  • sideBar.border#00000015
  • sideBar.foreground#2C3333
  • sideBarSectionHeader.background#D9D6D280
  • sideBarSectionHeader.foreground#2C3333
  • sideBarTitle.foreground#3C7F72
  • statusBar.background#FBFAF8
  • statusBar.border#00000015
  • statusBar.foreground#2C3333
  • statusBar.noFolderBackground#FBFAF8
  • tab.activeBackground#FBFAF8
  • tab.activeBorderTop#3C7F72
  • tab.activeForeground#2C3333
  • tab.border#00000015
  • tab.inactiveBackground#FBFAF860
  • tab.inactiveForeground#2C333380
  • terminal.ansiBlack#2C3333
  • terminal.ansiBlue#B9B1A7
  • terminal.ansiCyan#C1919C
  • terminal.ansiGreen#3C7F72
  • terminal.ansiMagenta#8B7763
  • terminal.ansiRed#8B7763
  • terminal.ansiWhite#2C3333
  • terminal.ansiYellow#C1919C
  • terminal.background#FBFAF8
  • terminal.foreground#2C3333
  • titleBar.activeBackground#FBFAF8
  • titleBar.activeForeground#2C3333
  • titleBar.border#00000015
  • titleBar.inactiveBackground#FBFAF8
  • titleBar.inactiveForeground#2C333360
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#7B6A74italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#B9B1A7bold
storage.type, storage.modifier#B9B1A7italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#3C7F72
string, punctuation.definition.string, string.template, meta.template.expression#C1919C
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#8B7763
variable, variable.other.readwrite, variable.other.object#2C3333
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#2C3333
variable.parameter, meta.parameter#2C3333dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#2C333380
keyword.operator#2C3333
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#C1919Cbold
entity.other.inherited-class#3C7F72
entity.name.tag, punctuation.definition.tag#B9B1A7
entity.other.attribute-name#3C7F72
meta.diff, meta.diff.header#7B6A74
markup.deleted#8B7763
markup.inserted#3C7F72
markup.changed#C1919C
markup.heading, markup.heading.setext, punctuation.definition.heading#3C7F72bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#C1919C
string.other.link.title, string.other.link.description#3C7F72
markup.underline.link#7B6A74underline
punctuation.definition.list#B9B1A7
markup.quote, punctuation.definition.quote#7B6A74italic
Morphous Theme by Ameyanagi - VS Code Theme