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#FBFAF9
  • activityBar.border#00000015
  • activityBar.foreground#F2B2C4
  • activityBar.inactiveForeground#F2EFEF60
  • activityBarBadge.background#F2B2C4
  • activityBarBadge.foreground#FBFAF9
  • button.background#F2B2C4
  • button.foreground#FBFAF9
  • button.hoverBackground#F2B2C4dd
  • editor.background#FBFAF9
  • editor.foreground#F2EFEF
  • editor.inactiveSelectionBackground#F7D7E62580
  • editor.lineHighlightBackground#F2EFEF50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#F7D7E625
  • editorCursor.foreground#F2B2C4
  • editorGroupHeader.tabsBackground#F2EFEFaa
  • editorLineNumber.activeForeground#F2B2C4
  • editorLineNumber.foreground#E6E2E780
  • focusBorder#F2B2C4
  • foreground#F2EFEF
  • input.background#F2EFEF
  • input.border#00000015
  • input.foreground#F2EFEF
  • input.placeholderForeground#F2EFEF60
  • list.activeSelectionBackground#F2B2C430
  • list.activeSelectionForeground#F2EFEF
  • list.highlightForeground#F2B2C4
  • list.hoverBackground#F2EFEF40
  • list.hoverForeground#F2EFEF
  • list.inactiveSelectionBackground#F2B2C415
  • list.inactiveSelectionForeground#F2EFEF
  • selection.background#F7D7E625
  • sideBar.background#F2EFEF
  • sideBar.border#00000015
  • sideBar.foreground#F2EFEF
  • sideBarSectionHeader.background#F2EFEF80
  • sideBarSectionHeader.foreground#F2EFEF
  • sideBarTitle.foreground#F2B2C4
  • statusBar.background#FBFAF9
  • statusBar.border#00000015
  • statusBar.foreground#F2EFEF
  • statusBar.noFolderBackground#FBFAF9
  • tab.activeBackground#FBFAF9
  • tab.activeBorderTop#F2B2C4
  • tab.activeForeground#F2EFEF
  • tab.border#00000015
  • tab.inactiveBackground#FBFAF960
  • tab.inactiveForeground#F2EFEF80
  • terminal.ansiBlack#F2EFEF
  • terminal.ansiBlue#F7D7E6
  • terminal.ansiCyan#8A9C68
  • terminal.ansiGreen#F2B2C4
  • terminal.ansiMagenta#F6E9C5
  • terminal.ansiRed#F6E9C5
  • terminal.ansiWhite#F2EFEF
  • terminal.ansiYellow#8A9C68
  • terminal.background#FBFAF9
  • terminal.foreground#F2EFEF
  • titleBar.activeBackground#FBFAF9
  • titleBar.activeForeground#F2EFEF
  • titleBar.border#00000015
  • titleBar.inactiveBackground#FBFAF9
  • titleBar.inactiveForeground#F2EFEF60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#E6E2E7italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#F7D7E6bold
storage.type, storage.modifier#F7D7E6italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#F2B2C4
string, punctuation.definition.string, string.template, meta.template.expression#8A9C68
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#F6E9C5
variable, variable.other.readwrite, variable.other.object#F2EFEF
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F2EFEF
variable.parameter, meta.parameter#F2EFEFdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F2EFEF80
keyword.operator#F2EFEF
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#8A9C68bold
entity.other.inherited-class#F2B2C4
entity.name.tag, punctuation.definition.tag#F7D7E6
entity.other.attribute-name#F2B2C4
meta.diff, meta.diff.header#E6E2E7
markup.deleted#F6E9C5
markup.inserted#F2B2C4
markup.changed#8A9C68
markup.heading, markup.heading.setext, punctuation.definition.heading#F2B2C4bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#8A9C68
string.other.link.title, string.other.link.description#F2B2C4
markup.underline.link#E6E2E7underline
punctuation.definition.list#F7D7E6
markup.quote, punctuation.definition.quote#E6E2E7italic
Morphous Theme by Ameyanagi - VS Code Theme