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#F6FBFC
  • activityBar.border#00000015
  • activityBar.foreground#17C9D4
  • activityBar.inactiveForeground#081F2D60
  • activityBarBadge.background#17C9D4
  • activityBarBadge.foreground#F6FBFC
  • button.background#17C9D4
  • button.foreground#F6FBFC
  • button.hoverBackground#17C9D4dd
  • editor.background#F6FBFC
  • editor.foreground#081F2D
  • editor.inactiveSelectionBackground#C7F05A2580
  • editor.lineHighlightBackground#F2F7FA50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#C7F05A25
  • editorCursor.foreground#17C9D4
  • editorGroupHeader.tabsBackground#F2F7FAaa
  • editorLineNumber.activeForeground#17C9D4
  • editorLineNumber.foreground#78A1B380
  • focusBorder#17C9D4
  • foreground#081F2D
  • input.background#F2F7FA
  • input.border#00000015
  • input.foreground#081F2D
  • input.placeholderForeground#081F2D60
  • list.activeSelectionBackground#17C9D430
  • list.activeSelectionForeground#081F2D
  • list.highlightForeground#17C9D4
  • list.hoverBackground#F2F7FA40
  • list.hoverForeground#081F2D
  • list.inactiveSelectionBackground#17C9D415
  • list.inactiveSelectionForeground#081F2D
  • selection.background#C7F05A25
  • sideBar.background#F2F7FA
  • sideBar.border#00000015
  • sideBar.foreground#081F2D
  • sideBarSectionHeader.background#F2F7FA80
  • sideBarSectionHeader.foreground#081F2D
  • sideBarTitle.foreground#17C9D4
  • statusBar.background#F6FBFC
  • statusBar.border#00000015
  • statusBar.foreground#081F2D
  • statusBar.noFolderBackground#F6FBFC
  • tab.activeBackground#F6FBFC
  • tab.activeBorderTop#17C9D4
  • tab.activeForeground#081F2D
  • tab.border#00000015
  • tab.inactiveBackground#F6FBFC60
  • tab.inactiveForeground#081F2D80
  • terminal.ansiBlack#081F2D
  • terminal.ansiBlue#C7F05A
  • terminal.ansiCyan#FF7FA6
  • terminal.ansiGreen#17C9D4
  • terminal.ansiMagenta#FF8A5B
  • terminal.ansiRed#FF8A5B
  • terminal.ansiWhite#081F2D
  • terminal.ansiYellow#FF7FA6
  • terminal.background#F6FBFC
  • terminal.foreground#081F2D
  • titleBar.activeBackground#F6FBFC
  • titleBar.activeForeground#081F2D
  • titleBar.border#00000015
  • titleBar.inactiveBackground#F6FBFC
  • titleBar.inactiveForeground#081F2D60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#78A1B3italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#C7F05Abold
storage.type, storage.modifier#C7F05Aitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#17C9D4
string, punctuation.definition.string, string.template, meta.template.expression#FF7FA6
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#FF8A5B
variable, variable.other.readwrite, variable.other.object#081F2D
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#081F2D
variable.parameter, meta.parameter#081F2Ddditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#081F2D80
keyword.operator#081F2D
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#FF7FA6bold
entity.other.inherited-class#17C9D4
entity.name.tag, punctuation.definition.tag#C7F05A
entity.other.attribute-name#17C9D4
meta.diff, meta.diff.header#78A1B3
markup.deleted#FF8A5B
markup.inserted#17C9D4
markup.changed#FF7FA6
markup.heading, markup.heading.setext, punctuation.definition.heading#17C9D4bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#FF7FA6
string.other.link.title, string.other.link.description#17C9D4
markup.underline.link#78A1B3underline
punctuation.definition.list#C7F05A
markup.quote, punctuation.definition.quote#78A1B3italic