Skip to main content
CodingTheme

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#F3F3F3
  • activityBar.border#CCCCCC
  • activityBar.foreground#000000
  • activityBar.inactiveForeground#616161
  • activityBarBadge.background#007ACC
  • activityBarBadge.foreground#FFFFFF
  • badge.background#C4C4C4
  • badge.foreground#000000
  • breadcrumb.activeSelectionForeground#000000
  • breadcrumb.background#F6F6F6
  • breadcrumb.focusForeground#000000
  • breadcrumb.foreground#616161
  • button.background#007ACC
  • button.foreground#FFFFFF
  • button.hoverBackground#0062A3
  • dropdown.background#FFFFFF
  • dropdown.border#CCCCCC
  • dropdown.foreground#000000
  • editor.background#FFFFFF
  • editor.foreground#000000
  • editor.inactiveSelectionBackground#E5EBF180
  • editor.lineHighlightBackground#F0F0F0
  • editor.selectionBackground#ADD6FF
  • editorBracketHighlight.foreground1#000000
  • editorBracketHighlight.foreground2#000000
  • editorBracketHighlight.foreground3#000000
  • editorBracketHighlight.foreground4#000000
  • editorBracketHighlight.foreground5#000000
  • editorBracketHighlight.foreground6#000000
  • editorBracketMatch.background#DBD7CA
  • editorBracketMatch.border#00000000
  • editorCursor.foreground#000000
  • editorError.foreground#E51400
  • editorIndentGuide.activeBackground1#939393
  • editorIndentGuide.background1#D3D3D3
  • editorInfo.foreground#1A85FF
  • editorLineNumber.activeForeground#000000
  • editorLineNumber.foreground#2B91AF
  • editorSuggestWidget.background#F6F6F6
  • editorSuggestWidget.border#CCCCCC
  • editorSuggestWidget.selectedBackground#007ACC
  • editorSuggestWidget.selectedForeground#FFFFFF
  • editorWarning.foreground#BF8803
  • editorWhitespace.foreground#BFBFBF
  • editorWidget.background#F6F6F6
  • editorWidget.border#CCCCCC
  • gitDecoration.conflictingResourceForeground#BF8803
  • gitDecoration.deletedResourceForeground#E51400
  • gitDecoration.ignoredResourceForeground#8E8E8E
  • gitDecoration.modifiedResourceForeground#007ACC
  • gitDecoration.untrackedResourceForeground#388A34
  • input.background#FFFFFF
  • input.border#CCCCCC
  • input.foreground#000000
  • input.placeholderForeground#767676
  • list.activeSelectionBackground#007ACC
  • list.activeSelectionForeground#FFFFFF
  • list.focusBackground#007ACC
  • list.focusForeground#FFFFFF
  • list.hoverBackground#E8E8E8
  • list.hoverForeground#000000
  • list.inactiveSelectionBackground#E4E6F1
  • list.inactiveSelectionForeground#000000
  • panel.background#F6F6F6
  • panel.border#CCCCCC
  • panelTitle.activeBorder#007ACC
  • panelTitle.activeForeground#000000
  • panelTitle.inactiveForeground#616161
  • scrollbarSlider.activeBackground#BFBFBF
  • scrollbarSlider.background#79797966
  • scrollbarSlider.hoverBackground#646464B3
  • sideBar.background#F6F6F6
  • sideBar.border#CCCCCC
  • sideBar.foreground#000000
  • sideBarSectionHeader.background#E5E5E5
  • sideBarSectionHeader.foreground#000000
  • sideBarTitle.foreground#000000
  • statusBar.background#007ACC
  • statusBar.debuggingBackground#CC6633
  • statusBar.foreground#FFFFFF
  • statusBar.noFolderBackground#68217A
  • statusBarItem.hoverBackground#0062A3
  • tab.activeBackground#FFFFFF
  • tab.activeBorder#007ACC
  • tab.activeBorderTop#007ACC
  • tab.activeForeground#000000
  • tab.border#CCCCCC
  • tab.inactiveBackground#ECECEC
  • tab.inactiveForeground#616161
  • terminal.background#FFFFFF
  • terminal.foreground#000000
  • terminalCursor.foreground#000000
  • titleBar.activeBackground#DDDDDD
  • titleBar.activeForeground#000000
  • titleBar.border#CCCCCC
  • titleBar.inactiveBackground#EEEEEE
  • titleBar.inactiveForeground#616161

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#008000
entity.name.type.namespace#808080
punctuation.curlybrace, punctuation.parenthesis, punctuation.squarebracket, punctuation.separator, punctuation.terminator#000000
meta.embedded.interpolation, meta.interpolation.cs#000000
string, string.quoted, string.template#A31515
punctuation.definition.interpolation#A31515
meta.interpolation, source.cs meta.interpolation#000000
constant.numeric#098658
constant.language, constant.character, constant.other#0000FF
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.other.using, keyword.other.namespace, storage.type, storage.modifier#0000FF
keyword.operator, keyword.operator.arithmetic, keyword.operator.assignment, keyword.operator.comparison, keyword.operator.logical#000000
entity.name.function, support.function#000000
variable.other.object.cs#2B91AF
variable.parameter#000000
entity.name.type, entity.name.class, support.type, support.class#2B91AF
entity.name.interface#2B91AF
variable.other.property, support.variable.property#000000
entity.name.tag, meta.tag#800000
entity.other.attribute-name#FF0000
entity.name.namespace#000000
invalid, invalid.illegal#FF0000
markup.bold#000000bold
markup.italic#000000italic
markup.heading#0000FFbold
markup.underline.link#0000FFunderline
support.type.property-name.json#0451A5
entity.other.attribute-name.class.css#800000
entity.other.attribute-name.id.css#800000
support.type.property-name.css#9CDCFE

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Visual Studio Theme Standard by JohnK - VS Code Theme