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

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#241812
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#241812
variable.parameter, meta.parameter#241812dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#24181280
keyword.operator#241812
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