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#0F1416
  • activityBar.border#ffffff15
  • activityBar.foreground#0A64FF
  • activityBar.inactiveForeground#F6FAFB60
  • activityBarBadge.background#0A64FF
  • activityBarBadge.foreground#0F1416
  • button.background#0A64FF
  • button.foreground#0F1416
  • button.hoverBackground#0A64FFdd
  • editor.background#0F1416
  • editor.foreground#F6FAFB
  • editor.inactiveSelectionBackground#1FAF8A3580
  • editor.lineHighlightBackground#0D0B0F40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#1FAF8A35
  • editorCursor.foreground#0A64FF
  • editorGroupHeader.tabsBackground#0F1416dd
  • editorLineNumber.activeForeground#0A64FF
  • editorLineNumber.foreground#6C7A7C80
  • focusBorder#0A64FF
  • foreground#F6FAFB
  • input.background#0D0B0F
  • input.border#ffffff15
  • input.foreground#F6FAFB
  • input.placeholderForeground#F6FAFB60
  • list.activeSelectionBackground#0A64FF30
  • list.activeSelectionForeground#F6FAFB
  • list.highlightForeground#0A64FF
  • list.hoverBackground#0D0B0F40
  • list.hoverForeground#F6FAFB
  • list.inactiveSelectionBackground#0A64FF15
  • list.inactiveSelectionForeground#F6FAFB
  • selection.background#1FAF8A35
  • sideBar.background#0D0B0F
  • sideBar.border#ffffff15
  • sideBar.foreground#F6FAFB
  • sideBarSectionHeader.background#0F141680
  • sideBarSectionHeader.foreground#F6FAFB
  • sideBarTitle.foreground#0A64FF
  • statusBar.background#0F1416
  • statusBar.border#ffffff15
  • statusBar.foreground#F6FAFB
  • statusBar.noFolderBackground#0F1416
  • tab.activeBackground#0F1416
  • tab.activeBorderTop#0A64FF
  • tab.activeForeground#F6FAFB
  • tab.border#ffffff15
  • tab.inactiveBackground#0D0B0F60
  • tab.inactiveForeground#F6FAFB80
  • terminal.ansiBlack#0F1416
  • terminal.ansiBlue#1FAF8A
  • terminal.ansiCyan#3FD4FF
  • terminal.ansiGreen#0A64FF
  • terminal.ansiMagenta#AEEBFF
  • terminal.ansiRed#AEEBFF
  • terminal.ansiWhite#F6FAFB
  • terminal.ansiYellow#3FD4FF
  • terminal.background#0F1416
  • terminal.foreground#F6FAFB
  • titleBar.activeBackground#0F1416
  • titleBar.activeForeground#F6FAFB
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#0F1416
  • titleBar.inactiveForeground#F6FAFB60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6C7A7Citalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#1FAF8Abold
storage.type, storage.modifier#1FAF8Aitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#0A64FF
string, punctuation.definition.string, string.template, meta.template.expression#3FD4FF
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#AEEBFF
variable, variable.other.readwrite, variable.other.object#F6FAFB
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F6FAFB
variable.parameter, meta.parameter#F6FAFBdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F6FAFB80
keyword.operator#F6FAFB
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#3FD4FFbold
entity.other.inherited-class#0A64FF
entity.name.tag, punctuation.definition.tag#1FAF8A
entity.other.attribute-name#0A64FF
meta.diff, meta.diff.header#6C7A7C
markup.deleted#AEEBFF
markup.inserted#0A64FF
markup.changed#3FD4FF
markup.heading, markup.heading.setext, punctuation.definition.heading#0A64FFbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#3FD4FF
string.other.link.title, string.other.link.description#0A64FF
markup.underline.link#6C7A7Cunderline
punctuation.definition.list#1FAF8A
markup.quote, punctuation.definition.quote#6C7A7Citalic
Morphous Theme by Ameyanagi - VS Code Theme