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#4B3A2F
  • activityBar.border#ffffff15
  • activityBar.foreground#F4A618
  • activityBar.inactiveForeground#fbf4df60
  • activityBarBadge.background#F4A618
  • activityBarBadge.foreground#4B3A2F
  • button.background#F4A618
  • button.foreground#4B3A2F
  • button.hoverBackground#F4A618dd
  • editor.background#4B3A2F
  • editor.foreground#fbf4df
  • editor.inactiveSelectionBackground#FFC56A3580
  • editor.lineHighlightBackground#24181240
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#FFC56A35
  • editorCursor.foreground#F4A618
  • editorGroupHeader.tabsBackground#4B3A2Fdd
  • editorLineNumber.activeForeground#F4A618
  • editorLineNumber.foreground#b89a6580
  • focusBorder#F4A618
  • foreground#fbf4df
  • input.background#241812
  • input.border#ffffff15
  • input.foreground#fbf4df
  • input.placeholderForeground#fbf4df60
  • list.activeSelectionBackground#F4A61830
  • list.activeSelectionForeground#fbf4df
  • list.highlightForeground#F4A618
  • list.hoverBackground#24181240
  • list.hoverForeground#fbf4df
  • list.inactiveSelectionBackground#F4A61815
  • list.inactiveSelectionForeground#fbf4df
  • selection.background#FFC56A35
  • sideBar.background#241812
  • sideBar.border#ffffff15
  • sideBar.foreground#fbf4df
  • sideBarSectionHeader.background#4B3A2F80
  • sideBarSectionHeader.foreground#fbf4df
  • sideBarTitle.foreground#F4A618
  • statusBar.background#4B3A2F
  • statusBar.border#ffffff15
  • statusBar.foreground#fbf4df
  • statusBar.noFolderBackground#4B3A2F
  • tab.activeBackground#4B3A2F
  • tab.activeBorderTop#F4A618
  • tab.activeForeground#fbf4df
  • tab.border#ffffff15
  • tab.inactiveBackground#24181260
  • tab.inactiveForeground#fbf4df80
  • terminal.ansiBlack#4B3A2F
  • terminal.ansiBlue#FFC56A
  • terminal.ansiCyan#6A8F5A
  • terminal.ansiGreen#F4A618
  • terminal.ansiMagenta#8BAE68
  • terminal.ansiRed#8BAE68
  • terminal.ansiWhite#fbf4df
  • terminal.ansiYellow#6A8F5A
  • terminal.background#4B3A2F
  • terminal.foreground#fbf4df
  • titleBar.activeBackground#4B3A2F
  • titleBar.activeForeground#fbf4df
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#4B3A2F
  • titleBar.inactiveForeground#fbf4df60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#b89a65italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#FFC56Abold
storage.type, storage.modifier#FFC56Aitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#F4A618
string, punctuation.definition.string, string.template, meta.template.expression#6A8F5A
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#8BAE68
variable, variable.other.readwrite, variable.other.object#fbf4df
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#fbf4df
variable.parameter, meta.parameter#fbf4dfdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#fbf4df80
keyword.operator#fbf4df
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#6A8F5Abold
entity.other.inherited-class#F4A618
entity.name.tag, punctuation.definition.tag#FFC56A
entity.other.attribute-name#F4A618
meta.diff, meta.diff.header#b89a65
markup.deleted#8BAE68
markup.inserted#F4A618
markup.changed#6A8F5A
markup.heading, markup.heading.setext, punctuation.definition.heading#F4A618bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#6A8F5A
string.other.link.title, string.other.link.description#F4A618
markup.underline.link#b89a65underline
punctuation.definition.list#FFC56A
markup.quote, punctuation.definition.quote#b89a65italic
Morphous Theme by Ameyanagi - VS Code Theme