Skip to main content
Coding Theme

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.activeBorder#DD7596
  • activityBar.background#2E3A48
  • activityBar.foreground#B7C3F3
  • activityBar.inactiveForeground#4F6272
  • activityBarBadge.background#D05786
  • breadcrumb.background#404E5C
  • breadcrumb.foreground#B7C3F3
  • editor.background#404E5C
  • editor.foreground#B7C3F3
  • editor.selectionBackground#4F627266
  • editor.wordHighlightBackground#BCB6FF33
  • editor.wordHighlightStrongBackground#B8E1FF33
  • editorBracketHighlight.foreground1#63C5EA
  • editorBracketHighlight.foreground2#9F7EBE
  • editorBracketHighlight.foreground3#83AFDF
  • editorBracketHighlight.foreground4#BCB6FF
  • editorBracketHighlight.foreground5#B8E1FF
  • editorBracketHighlight.foreground6#A9FFF7
  • editorError.foreground#D05786
  • editorGroupHeader.tabsBackground#363E4A
  • editorHint.foreground#82ABA1
  • editorInfo.foreground#A9FFF7
  • editorLineHighlight.background#4F627233
  • editorWarning.foreground#ECDA90
  • editorWidget.background#363E4A
  • editorWidget.foreground#B7C3F3
  • menu.background#363E4A
  • menu.foreground#B7C3F3
  • menu.selectionBackground#4F6272
  • menu.selectionForeground#B7C3F3
  • menubar.selectionBackground#4F6272
  • menubar.selectionForeground#B7C3F3
  • notifications.background#363E4A
  • notifications.foreground#B7C3F3
  • progressBar.background#DD7596
  • quickInput.background#363E4A
  • quickInput.foreground#B7C3F3
  • sideBar.background#363E4A
  • sideBar.foreground#B7C3F3
  • sideBarSectionHeader.background#4F6272
  • sideBarSectionHeader.foreground#B7C3F3
  • sideBarTitle.foreground#B7C3F3
  • statusBar.background#2E3A48
  • statusBar.debuggingBackground#D05786
  • statusBar.foreground#B7C3F3
  • statusBar.noFolderBackground#2E3A48
  • tab.activeBackground#404E5C
  • tab.activeBorderTop#DD7596
  • tab.activeForeground#B7C3F3
  • tab.inactiveBackground#363E4A
  • tab.inactiveForeground#4F6272
  • terminal.ansiBlack#363E4A
  • terminal.ansiBlue#B8E1FF
  • terminal.ansiBrightBlue#B8E1FF
  • terminal.ansiBrightCyan#A9FFF7
  • terminal.ansiBrightGreen#94FBAB
  • terminal.ansiBrightMagenta#BCB6FF
  • terminal.ansiCyan#A9FFF7
  • terminal.ansiGreen#94FBAB
  • terminal.ansiMagenta#BCB6FF
  • terminal.ansiRed#D05786
  • terminal.ansiWhite#B7C3F3
  • terminal.ansiYellow#DD7596
  • terminal.background#404E5C
  • terminal.foreground#B7C3F3
  • titleBar.activeBackground#2E3A48
  • titleBar.activeForeground#B7C3F3

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#82ABA1
string, constant.other.symbol#83AFDF
keyword, storage.type, storage.modifier#DD7596
entity.name.function, meta.function-call#63C5EA
variable.parameter, meta.parameter#AED6F1
variable.function, meta.function-call.generic#63C5EAitalic
variable, support.variable#B7C3F3
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution#DD7596
constant.numeric#A9FFF7
constant#D05786
entity.name.tag#DD7596
entity.other.attribute-name#B7C3F3
support.type.property-name.json#ECDA90
string.quoted.double.json#83AFDF
punctuation.support.type.property-name.begin.json, punctuation.support.type.property-name.end.json, punctuation.separator.dictionary.key-value.json, punctuation.definition.dictionary.begin.json, punctuation.definition.dictionary.end.json, punctuation.definition.array.begin.json, punctuation.definition.array.end.json#9F7EBE
keyword.operator#9F7EBE
meta.method-call entity.name.function#63C5EA
meta.method entity.name.function#63C5EA
meta.definition.function entity.name.function#63C5EA
keyword.control.flow.sql, keyword.control.import.sql, keyword.operator.logical.sql#DD7596bold
support.function.builtin.sql#63C5EA
variable.parameter.function.sql#AED6F1
constant.language.sql#D05786bold
keyword.operator.sql#9F7EBE
entity.name.type.table.sql#DD7596bold
entity.name.type.column.sql#B7C3F3
string.quoted.single.sql, string.quoted.double.sql#83AFDF
comment.line.sql, punctuation.definition.comment.sql#82ABA1
punctuation.definition.sql#9F7EBE
SQL Variables
meta.decorator.python, entity.name.function.decorator.python#9F7EBEitalic
variable.parameter.function.python#AED6F1
meta.function-call.python, meta.function-call.generic.python#63C5EA
support.function.builtin.python#83AFDFitalic
variable.parameter.function.language.special.self.python, variable.language.special.self.python#DD7596italic
entity.name.type.class.python#DD7596bold
meta.import.python, entity.name.namespace.python#9F7EBE
meta.fstring.python, constant.character.format.placeholder.other.python#83AFDF
string.quoted.docstring.multi.python#82ABA1italic
support.function.magic.python#83AFDFbold italic
meta.function.annotation.return.python, meta.function.parameters.annotation.python, support.type.python#83AFDF
constant.language.python#D05786bold
support.type.exception.python#D05786italic
keyword.control.flow.python, keyword.control.import.python, keyword.operator.logical.python#DD7596bold
constant.character.format.placeholder.other.python#ECDA90
meta.comprehension.python#B7C3F3
meta.lambda-function.python#9F7EBE
entity.name.type.interface#B8E1FFbold
entity.name.type.enum#BCB6FFbold
entity.other.attribute-name.html, entity.other.attribute-name.xml#94FBAB
support.type.property-name.css, support.type.property-name.scss#A9FFF7
support.constant.property-value.css#82ABA1
markup.heading#BCB6FFbold
markup.underline.link#B8E1FF
markup.fenced_code.block#A9FFF7
markup.list#94FBAB
markup.italic#82ABA1italic
Nebula Nights Pastel by Tom-Fynes - VS Code Theme