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#F5F9FA
  • activityBar.border#00000015
  • activityBar.foreground#25936A
  • activityBar.inactiveForeground#10231C60
  • activityBarBadge.background#25936A
  • activityBarBadge.foreground#F5F9FA
  • button.background#25936A
  • button.foreground#F5F9FA
  • button.hoverBackground#25936Add
  • editor.background#F5F9FA
  • editor.foreground#10231C
  • editor.inactiveSelectionBackground#216C832580
  • editor.lineHighlightBackground#F5FAF950
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#216C8325
  • editorCursor.foreground#25936A
  • editorGroupHeader.tabsBackground#F5FAF9aa
  • editorLineNumber.activeForeground#25936A
  • editorLineNumber.foreground#8A9A8F80
  • focusBorder#25936A
  • foreground#10231C
  • input.background#F5FAF9
  • input.border#00000015
  • input.foreground#10231C
  • input.placeholderForeground#10231C60
  • list.activeSelectionBackground#25936A30
  • list.activeSelectionForeground#10231C
  • list.highlightForeground#25936A
  • list.hoverBackground#F5FAF940
  • list.hoverForeground#10231C
  • list.inactiveSelectionBackground#25936A15
  • list.inactiveSelectionForeground#10231C
  • selection.background#216C8325
  • sideBar.background#F5FAF9
  • sideBar.border#00000015
  • sideBar.foreground#10231C
  • sideBarSectionHeader.background#F5FAF980
  • sideBarSectionHeader.foreground#10231C
  • sideBarTitle.foreground#25936A
  • statusBar.background#F5F9FA
  • statusBar.border#00000015
  • statusBar.foreground#10231C
  • statusBar.noFolderBackground#F5F9FA
  • tab.activeBackground#F5F9FA
  • tab.activeBorderTop#25936A
  • tab.activeForeground#10231C
  • tab.border#00000015
  • tab.inactiveBackground#F5F9FA60
  • tab.inactiveForeground#10231C80
  • terminal.ansiBlack#10231C
  • terminal.ansiBlue#216C83
  • terminal.ansiCyan#29A349
  • terminal.ansiGreen#25936A
  • terminal.ansiMagenta#19765D
  • terminal.ansiRed#19765D
  • terminal.ansiWhite#10231C
  • terminal.ansiYellow#29A349
  • terminal.background#F5F9FA
  • terminal.foreground#10231C
  • titleBar.activeBackground#F5F9FA
  • titleBar.activeForeground#10231C
  • titleBar.border#00000015
  • titleBar.inactiveBackground#F5F9FA
  • titleBar.inactiveForeground#10231C60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#8A9A8Fitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#216C83bold
storage.type, storage.modifier#216C83italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#25936A
string, punctuation.definition.string, string.template, meta.template.expression#29A349
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#19765D
variable, variable.other.readwrite, variable.other.object#10231C
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#10231C
variable.parameter, meta.parameter#10231Cdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#10231C80
keyword.operator#10231C
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#29A349bold
entity.other.inherited-class#25936A
entity.name.tag, punctuation.definition.tag#216C83
entity.other.attribute-name#25936A
meta.diff, meta.diff.header#8A9A8F
markup.deleted#19765D
markup.inserted#25936A
markup.changed#29A349
markup.heading, markup.heading.setext, punctuation.definition.heading#25936Abold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#29A349
string.other.link.title, string.other.link.description#25936A
markup.underline.link#8A9A8Funderline
punctuation.definition.list#216C83
markup.quote, punctuation.definition.quote#8A9A8Fitalic
Morphous Theme by Ameyanagi - VS Code Theme