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#1a1559
  • activityBarBadge.background#FF8C00
  • activityBarBadge.foreground#ffffff
  • badge.background#FF8C00
  • badge.foreground#ffffff
  • button.background#FF8C00
  • button.foreground#ffffff
  • debugToolBar.background#1a1559
  • dropdown.background#1e1866
  • editor.background#130f40
  • editor.foreground#00AB9F
  • editor.lineHighlightBorder#FFFFFF1a
  • editor.rangeHighlightBackground#FFFFFF0d
  • editorGroup.dropBackground#FF8C0080
  • editorGroup.focusedEmptyBorder#FF8C00
  • editorGroupHeader.tabsBackground#16124c
  • editorHoverWidget.background#16124c
  • editorLineNumber.activeForeground#FF8C00
  • editorLineNumber.foreground#FFFFFF4d
  • editorMarkerNavigation.background#16124c
  • editorWidget.background#16124c
  • focusBorder#FF8C00
  • foreground#00AB9F
  • input.background#1e1866
  • inputOption.activeBorder#FF8C00
  • list.activeSelectionBackground#FF8C0080
  • list.activeSelectionForeground#FF8C00
  • list.dropBackground#FF8C0080
  • list.focusBackground#FF8C0080
  • list.focusForeground#FF8C00
  • list.highlightForeground#FF8C00
  • list.hoverBackground#4834d4
  • list.inactiveSelectionBackground#FFFFFF33
  • panel.background#130f40
  • panel.border#130f40
  • panelTitle.activeBorder#FF8C00
  • panelTitle.inactiveForeground#00AB9F80
  • peekView.border#FF8C00
  • peekViewEditor.background#0f0c33
  • peekViewResult.background#16124c
  • peekViewTitle.background#130f40
  • pickerGroup.border#FFFFFF1a
  • selection.background#00AB9F
  • sideBar.background#16124c
  • sideBarSectionHeader.background#1a1559
  • statusBar.background#00AB9F
  • statusBar.debuggingBackground#00AB9F
  • statusBar.debuggingForeground#fff
  • statusBar.noFolderBackground#0f0c33
  • statusBarItem.activeBackground#FF8C0080
  • statusBarItem.hoverBackground#FFFFFF1a
  • statusBarItem.remoteBackground#FF8C00
  • statusBarItem.remoteForeground#FF8C00
  • tab.activeBorder#FF8C00
  • tab.activeModifiedBorder#FF8C00
  • tab.border#00AB9F
  • tab.inactiveBackground#1a1559
  • tab.inactiveModifiedBorder#995400
  • tab.unfocusedActiveModifiedBorder#cc7000
  • tab.unfocusedInactiveModifiedBorder#995400
  • titleBar.activeBackground#00AB9F

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
Global settings#00AB9F
string#00AB9F
constant.character.escape, text.html constant.character.entity.named, punctuation.definition.entity.html#00AB9F
constant.language.boolean#FF8C00
constant.numeric#FF8C00
variable, support.variable, support.class, support.constant, meta.definition.variable entity.name.function#ffd200
keyword, modifier, variable.language.this, support.type.object, constant.language#FF8C00
entity.name.function, support.function#FF8C00
storage.type, storage.modifier#FF8C00
support.module, support.node#ffd200italic
support.type#00AB9F
entity.name.type, entity.other.inherited-class#00AB9F
comment#5b1fa0italic
entity.name.type.class#00AB9Funderline
variable.object.property, meta.field.declaration entity.name.function#00AB9F
meta.definition.method entity.name.function#00AB9F
meta.function entity.name.function#00AB9F
template.expression.begin, template.expression.end, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end#FF8C00
meta.embedded, source.groovy.embedded, meta.template.expression#00AB9F
entity.name.tag.yaml#ffd200
meta.object-literal.key, meta.object-literal.key string, support.type.property-name.json#ffd200
constant.language.json#FF8C00
entity.other.attribute-name.class#FF8C00
entity.other.attribute-name.id#00AB9F
source.css entity.name.tag#00AB9F
meta.tag, punctuation.definition.tag#FF8C00
entity.name.tag#ffd200
entity.other.attribute-name#FF8C00
markup.heading#FF8C00
text.html.markdown meta.link.inline, meta.link.reference#ffd200
text.html.markdown beginning.punctuation.definition.list#FF8C00
markup.italic#ffd200italic
markup.bold#ffd200bold
markup.bold markup.italic, markup.italic markup.bold#ffd200italic bold
markup.fenced_code.block.markdown punctuation.definition.markdown#00AB9F
markup.inline.raw.string.markdown#00AB9F
keyword.other.definition.ini#ffd200
entity.name.section.group-title.ini#FF8C00
source.cs meta.class.identifier storage.type#00AB9Funderline
source.cs meta.method.identifier entity.name.function#00AB9F
source.cs meta.method-call meta.method, source.cs entity.name.function#FF8C00
source.cs storage.type#00AB9F
source.cs meta.method.return-type#00AB9F
source.cs meta.preprocessor#392dc0
source.cs entity.name.type.namespace#00AB9F
Global settings#00AB9F