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.activeBorder#8257E5
  • activityBar.background#0F0F11
  • activityBar.foreground#E4E4E7
  • activityBar.inactiveForeground#A1A1AA99
  • activityBarBadge.background#8257E5
  • activityBarBadge.foreground#FFFFFF
  • badge.background#8257E5
  • badge.foreground#FFFFFF
  • button.background#8257E5
  • button.foreground#FFFFFF
  • button.hoverBackground#9956F6
  • dropdown.background#1E1E22
  • dropdown.foreground#E4E4E7
  • editor.background#18181B
  • editor.findMatchBackground#8257E555
  • editor.findMatchHighlightBackground#8257E52A
  • editor.foreground#E4E4E7
  • editor.lineHighlightBackground#1E1E22
  • editor.selectionBackground#8257E540
  • editor.selectionHighlightBackground#8257E540
  • editor.wordHighlightBackground#8257E522
  • editorBracketHighlight.foreground1#9956F6
  • editorBracketHighlight.foreground2#29E0A9
  • editorBracketHighlight.foreground3#5F75F2
  • editorBracketHighlight.foreground4#E254FF
  • editorBracketHighlight.foreground5#F59E0B
  • editorBracketHighlight.foreground6#04D361
  • editorBracketHighlight.unexpectedBracket.foreground#EF4444
  • editorBracketMatch.background#8257E533
  • editorBracketMatch.border#8257E500
  • editorCursor.foreground#8257E5
  • editorError.foreground#EF4444
  • editorGroupHeader.tabsBackground#0F0F11
  • editorGutter.background#18181B
  • editorHint.foreground#8257E5
  • editorHoverWidget.background#0F0F11
  • editorHoverWidget.border#27272A
  • editorIndentGuide.activeBackground1#8257E566
  • editorIndentGuide.background1#27272A
  • editorInfo.foreground#5F75F2
  • editorLineNumber.activeForeground#8257E5
  • editorLineNumber.foreground#A1A1AA66
  • editorSuggestWidget.background#0F0F11
  • editorSuggestWidget.highlightForeground#9956F6
  • editorSuggestWidget.selectedBackground#8257E526
  • editorWarning.foreground#F59E0B
  • editorWhitespace.foreground#27272A
  • editorWidget.background#0F0F11
  • editorWidget.border#27272A
  • focusBorder#8257E588
  • foreground#E4E4E7
  • gitDecoration.addedResourceForeground#29E0A9
  • gitDecoration.deletedResourceForeground#EF4444
  • gitDecoration.modifiedResourceForeground#F59E0B
  • gitDecoration.untrackedResourceForeground#04D361
  • input.background#1E1E22
  • input.border#27272A
  • input.foreground#E4E4E7
  • inputOption.activeBorder#8257E5
  • list.activeSelectionBackground#8257E526
  • list.activeSelectionForeground#E4E4E7
  • list.highlightForeground#9956F6
  • list.hoverBackground#1E1E22
  • list.inactiveSelectionBackground#1E1E22
  • minimap.selectionHighlight#8257E5
  • notificationCenterHeader.background#0F0F11
  • notifications.background#0F0F11
  • panel.background#111113
  • panel.border#27272A
  • panelTitle.activeBorder#8257E5
  • panelTitle.activeForeground#E4E4E7
  • peekViewEditor.background#1E1E22
  • progressBar.background#8257E5
  • scrollbarSlider.activeBackground#8257E566
  • scrollbarSlider.background#A1A1AA22
  • scrollbarSlider.hoverBackground#A1A1AA44
  • selection.background#8257E540
  • sideBar.background#0F0F11
  • sideBar.foreground#A1A1AA
  • sideBarSectionHeader.background#0F0F11
  • sideBarSectionHeader.foreground#E4E4E7
  • sideBarTitle.foreground#E4E4E7
  • statusBar.background#0F0F11
  • statusBar.debuggingBackground#8257E5
  • statusBar.debuggingForeground#FFFFFF
  • statusBar.foreground#A1A1AA
  • statusBar.noFolderBackground#0F0F11
  • statusBarItem.remoteBackground#8257E5
  • statusBarItem.remoteForeground#FFFFFF
  • tab.activeBackground#18181B
  • tab.activeBorder#8257E500
  • tab.activeBorderTop#8257E5
  • tab.activeForeground#E4E4E7
  • tab.border#0F0F11
  • tab.inactiveBackground#0F0F11
  • tab.inactiveForeground#A1A1AA
  • terminal.ansiBlue#5F75F2
  • terminal.ansiBrightBlue#5F75F2
  • terminal.ansiBrightGreen#29E0A9
  • terminal.ansiBrightMagenta#E254FF
  • terminal.ansiCyan#29E0A9
  • terminal.ansiGreen#29E0A9
  • terminal.ansiMagenta#E254FF
  • terminal.ansiRed#EF4444
  • terminal.ansiYellow#F59E0B
  • terminal.background#111113
  • terminal.foreground#E4E4E7
  • terminalCursor.foreground#8257E5
  • textLink.activeForeground#8257E5
  • textLink.foreground#9956F6
  • titleBar.activeBackground#0F0F11
  • titleBar.activeForeground#E4E4E7
  • titleBar.inactiveBackground#0F0F11
  • titleBar.inactiveForeground#A1A1AA
  • tree.indentGuidesStroke#27272A

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6B6B73italic
string#29E0A9—
string.quoted.docstring, string.quoted.multi.python#6B6B73italic
constant.numeric, constant.numeric.python#E254FF—
constant.language, constant.language.python#E254FF—
constant.character, constant.other#E254FF—
keyword, keyword.control, keyword.control.flow.python, keyword.control.import.python#9956F6bold
keyword.operator, keyword.operator.logical.python, keyword.operator.python#A78BFA—
storage, storage.type, storage.type.function.python, storage.type.class.python, storage.modifier#9956F6italic
entity.name.function, meta.function-call.python, support.function, support.function.builtin.python#5F75F2—
entity.name.class, entity.name.type, entity.name.type.class.python, support.type, support.class#04D361bold
support.type.python, meta.function.parameters.python support.type#29E0A9—
variable, variable.other, meta.variable.python#E4E4E7—
variable.parameter, variable.parameter.function-call.python#C7B6F2italic
variable.language.special.self.python, variable.language.special.cls.python, variable.language#F59E0Bitalic
meta.decorator, entity.name.function.decorator.python, punctuation.definition.decorator.python#F59E0B—
meta.import, keyword.control.import#9956F6—
entity.name.namespace, support.module#04D361—
punctuation, punctuation.separator, punctuation.definition#A1A1AA—
meta.string.regexp, string.regexp#F59E0B—
meta.fstring.python, string.interpolated.python#29E0A9—
constant.character.format.placeholder, meta.interpolation.python#9956F6bold
meta.typehint.python, meta.function.return-type.python#29E0A9italic
markup.heading, entity.name.section#9956F6bold
markup.bold#E4E4E7bold
markup.italic#E4E4E7italic
markup.inline.raw, markup.fenced_code#29E0A9—
support.type.property-name.json#5F75F2—
invalid, invalid.illegal#EF4444—
PyTrack Themes — 5 temas para Python by Estevam Souza - VS Code Theme