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#22344f
  • activityBar.border#ffffff15
  • activityBar.foreground#4aa3df
  • activityBar.inactiveForeground#f7fbff60
  • activityBarBadge.background#4aa3df
  • activityBarBadge.foreground#22344f
  • button.background#4aa3df
  • button.foreground#22344f
  • button.hoverBackground#4aa3dfdd
  • editor.background#22344f
  • editor.foreground#f7fbff
  • editor.inactiveSelectionBackground#8ed7e83580
  • editor.lineHighlightBackground#10192340
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#8ed7e835
  • editorCursor.foreground#4aa3df
  • editorGroupHeader.tabsBackground#22344fdd
  • editorLineNumber.activeForeground#4aa3df
  • editorLineNumber.foreground#9fb0bd80
  • focusBorder#4aa3df
  • foreground#f7fbff
  • input.background#101923
  • input.border#ffffff15
  • input.foreground#f7fbff
  • input.placeholderForeground#f7fbff60
  • list.activeSelectionBackground#4aa3df30
  • list.activeSelectionForeground#f7fbff
  • list.highlightForeground#4aa3df
  • list.hoverBackground#10192340
  • list.hoverForeground#f7fbff
  • list.inactiveSelectionBackground#4aa3df15
  • list.inactiveSelectionForeground#f7fbff
  • selection.background#8ed7e835
  • sideBar.background#101923
  • sideBar.border#ffffff15
  • sideBar.foreground#f7fbff
  • sideBarSectionHeader.background#22344f80
  • sideBarSectionHeader.foreground#f7fbff
  • sideBarTitle.foreground#4aa3df
  • statusBar.background#22344f
  • statusBar.border#ffffff15
  • statusBar.foreground#f7fbff
  • statusBar.noFolderBackground#22344f
  • tab.activeBackground#22344f
  • tab.activeBorderTop#4aa3df
  • tab.activeForeground#f7fbff
  • tab.border#ffffff15
  • tab.inactiveBackground#10192360
  • tab.inactiveForeground#f7fbff80
  • terminal.ansiBlack#22344f
  • terminal.ansiBlue#8ed7e8
  • terminal.ansiCyan#415b9b
  • terminal.ansiGreen#4aa3df
  • terminal.ansiMagenta#1f73a8
  • terminal.ansiRed#1f73a8
  • terminal.ansiWhite#f7fbff
  • terminal.ansiYellow#415b9b
  • terminal.background#22344f
  • terminal.foreground#f7fbff
  • titleBar.activeBackground#22344f
  • titleBar.activeForeground#f7fbff
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#22344f
  • titleBar.inactiveForeground#f7fbff60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#9fb0bditalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#8ed7e8bold
storage.type, storage.modifier#8ed7e8italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#4aa3df
string, punctuation.definition.string, string.template, meta.template.expression#415b9b
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#1f73a8
variable, variable.other.readwrite, variable.other.object#f7fbff
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#f7fbff
variable.parameter, meta.parameter#f7fbffdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#f7fbff80
keyword.operator#f7fbff
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#415b9bbold
entity.other.inherited-class#4aa3df
entity.name.tag, punctuation.definition.tag#8ed7e8
entity.other.attribute-name#4aa3df
meta.diff, meta.diff.header#9fb0bd
markup.deleted#1f73a8
markup.inserted#4aa3df
markup.changed#415b9b
markup.heading, markup.heading.setext, punctuation.definition.heading#4aa3dfbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#415b9b
string.other.link.title, string.other.link.description#4aa3df
markup.underline.link#9fb0bdunderline
punctuation.definition.list#8ed7e8
markup.quote, punctuation.definition.quote#9fb0bditalic