ThemeDatabase All Themes

Color themes

• 

  poolside

• 

  Poolside

• 

  PopContrast

• 

  Popcorn

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#6261a1
• activityBar.border#6261a1
• activityBar.dropBackground#7870a7
• activityBar.foreground#d2abbe
• activityBarBadge.background#000000
• activityBarBadge.foreground#6261a1
• badge.background#000000
• badge.foreground#6261a1
• button.background#b5e5e5
• button.foreground#6261a1
• button.hoverBackground#3898ff
• debugExceptionWidget.background#7870a7
• debugExceptionWidget.border#7870a7
• debugToolBar.background#7870a7
• diffEditor.insertedTextBackground#00a7a720
• diffEditor.removedTextBackground#82000020
• dropdown.background#7870a7
• dropdown.border#7870a7
• dropdown.foreground#e9bac3
• editor.background#6261a1
• editor.findMatchBackground#ffebc47f
• editor.findMatchHighlightBackground#ffebc43f
• editor.findRangeHighlightBackground#7870a7
• editor.foreground#ffc9c9
• editor.hoverHighlightBackground#8f7fac
• editor.inactiveSelectionBackground#b5e5e533
• editor.lineHighlightBackground#6261a1
• editor.lineHighlightBorder#7870a7
• editor.rangeHighlightBackground#7870a7
• editor.selectionBackground#b5e5e533
• editor.selectionHighlightBackground#7870a7
• editor.wordHighlightBackground#0000007f
• editor.wordHighlightStrongBackground#8bc9f07f
• editorBracketMatch.background#7870a7
• editorBracketMatch.border#7870a7
• editorCodeLens.foreground#d2abbe
• editorCursor.foreground#000000
• editorError.border#ffc9c9
• editorError.foreground#820000
• editorGroup.border#7870a7
• editorGroup.dropBackground#8f7fac7f
• editorGroup.emptyBackground#6261a1
• editorGroup.focusedEmptyBorder#7870a7
• editorGroupHeader.noTabsBackground#6261a1
• editorGroupHeader.tabsBackground#6261a1
• editorGroupHeader.tabsBorder#6261a1
• editorGutter.addedBackground#00a7a7
• editorGutter.background#6261a1
• editorGutter.deletedBackground#820000
• editorGutter.modifiedBackground#ffebc4
• editorHoverWidget.background#7870a7
• editorHoverWidget.border#7870a7
• editorIndentGuide.activeBackground#8f7fac
• editorIndentGuide.background#7870a7
• editorLineNumber.foreground#8f7fac
• editorLink.activeForeground#3898ff
• editorMarkerNavigation.background#7870a7
• editorMarkerNavigationError.background#820000
• editorMarkerNavigationWarning.background#ffffff
• editorOverviewRuler.addedForeground#00a7a77f
• editorOverviewRuler.border#7870a7
• editorOverviewRuler.currentContentForeground#3898ff
• editorOverviewRuler.deletedForeground#8200007f
• editorOverviewRuler.errorForeground#8200007f
• editorOverviewRuler.findMatchForeground#ffebc4bf
• editorOverviewRuler.incomingContentForeground#b5e5e5
• editorOverviewRuler.infoForeground#b5e5e57f
• editorOverviewRuler.modifiedForeground#ffebc47f
• editorOverviewRuler.rangeHighlightForeground#8f7facbf
• editorOverviewRuler.selectionHighlightForeground#7870a7bf
• editorOverviewRuler.warningForeground#ffffff7f
• editorOverviewRuler.wordHighlightForeground#8f7facbf
• editorOverviewRuler.wordHighlightStrongForeground#a58eb2bf
• editorPane.background#6261a1
• editorRuler.foreground#7870a7
• editorSuggestWidget.background#7870a7
• editorSuggestWidget.border#7870a7
• editorSuggestWidget.foreground#e9bac3
• editorSuggestWidget.highlightForeground#8bc9f0
• editorSuggestWidget.selectedBackground#8f7fac
• editorWarning.border#e9bac3
• editorWarning.foreground#ffffff
• editorWhitespace.foreground#7870a7
• editorWidget.background#7870a7
• editorWidget.border#7870a7
• errorForeground#820000
• extensionButton.prominentBackground#b5e5e5
• extensionButton.prominentForeground#6261a1
• extensionButton.prominentHoverBackground#3898ff
• focusBorder#000000
• foreground#ffc9c9
• gitDecoration.conflictingResourceForeground#3898ff
• gitDecoration.deletedResourceForeground#820000
• gitDecoration.ignoredResourceForeground#a58eb2
• gitDecoration.modifiedResourceForeground#ffebc4
• gitDecoration.untrackedResourceForeground#000000
• input.background#7870a7
• input.border#7870a7
• input.foreground#e9bac3
• input.placeholderForeground#8f7fac
• inputOption.activeBorder#3898ff
• inputValidation.errorBackground#7870a7
• inputValidation.errorBorder#820000
• inputValidation.infoBackground#7870a7
• inputValidation.infoBorder#b5e5e5
• inputValidation.warningBackground#7870a7
• inputValidation.warningBorder#ffffff
• list.activeSelectionBackground#00a7a77f
• list.activeSelectionForeground#6261a1
• list.dropBackground#a58eb2
• list.focusBackground#a58eb2
• list.focusForeground#6261a1
• list.highlightForeground#ffebc4
• list.hoverBackground#7870a7
• list.hoverForeground#d2abbe
• list.inactiveSelectionBackground#7870a7
• list.inactiveSelectionForeground#ffc9c9
• merge.border#bc9cb8
• merge.currentContentBackground#3898ff7f
• merge.currentHeaderBackground#3898ff
• merge.incomingContentBackground#b5e5e57f
• merge.incomingHeaderBackground#b5e5e5
• notification.background#7870a7
• notification.buttonBackground#b5e5e5
• notification.buttonForeground#6261a1
• notification.buttonHoverBackground#3898ff
• notification.errorBackground#820000
• notification.errorForeground#6261a1
• notification.foreground#ffc9c9
• notification.infoBackground#b5e5e5
• notification.infoForeground#6261a1
• notification.warningBackground#ffffff
• notification.warningForeground#6261a1
• panel.background#6261a1
• panel.border#7870a7
• panelTitle.activeBorder#a58eb2
• panelTitle.activeForeground#e9bac3
• panelTitle.inactiveForeground#bc9cb8
• peekView.border#8bc9f0
• peekViewEditor.background#7870a7
• peekViewEditor.matchHighlightBackground#ffebc4
• peekViewEditorGutter.background#7870a7
• peekViewResult.background#7870a7
• peekViewResult.fileForeground#e9bac3
• peekViewResult.lineForeground#8f7fac
• peekViewResult.matchHighlightBackground#ffebc4
• peekViewResult.selectionBackground#a58eb2
• peekViewResult.selectionForeground#ffc9c9
• peekViewTitle.background#8f7fac
• peekViewTitleDescription.foreground#d2abbe
• peekViewTitleLabel.foreground#ffc9c9
• pickerGroup.border#d2abbe
• pickerGroup.foreground#ffc9c9
• progressBar.background#00a7a7
• scrollbar.shadow#6261a1
• scrollbarSlider.activeBackground#d2abbe7f
• scrollbarSlider.background#a58eb27f
• scrollbarSlider.hoverBackground#bc9cb87f
• selection.background#8f7fac
• sideBar.background#6261a1
• sideBar.border#7870a7
• sideBar.foreground#e9bac3
• sideBarSectionHeader.background#8f7fac
• sideBarSectionHeader.foreground#e9bac3
• sideBarTitle.foreground#d2abbe
• statusBar.background#b5e5e5
• statusBar.border#b5e5e57f
• statusBar.debuggingBackground#ffffff
• statusBar.debuggingBorder#ffffff7f
• statusBar.debuggingForeground#6261a1
• statusBar.foreground#6261a1
• statusBar.noFolderBackground#000000
• statusBar.noFolderBorder#0000007f
• statusBar.noFolderForeground#6261a1
• statusBarItem.activeBackground#3898ff
• statusBarItem.hoverBackground#00a7a7
• statusBarItem.prominentBackground#3898ff
• statusBarItem.prominentHoverBackground#00a7a7
• tab.activeBackground#7870a7
• tab.activeForeground#d2abbe
• tab.border#6261a1
• tab.inactiveBackground#6261a1
• tab.inactiveForeground#bc9cb8
• tab.unfocusedActiveForeground#a58eb2
• tab.unfocusedInactiveForeground#8f7fac
• terminal.ansiBlack#6261a1
• terminal.ansiBlue#b5e5e5
• terminal.ansiBrightBlack#7870a7
• terminal.ansiBrightBlue#b5e5e5
• terminal.ansiBrightCyan#3898ff
• terminal.ansiBrightGreen#3898ff
• terminal.ansiBrightMagenta#8bc9f0
• terminal.ansiBrightRed#ffffff
• terminal.ansiBrightWhite#ffc9c9
• terminal.ansiBrightYellow#ffebc4
• terminal.ansiCyan#3898ff
• terminal.ansiGreen#00a7a7
• terminal.ansiMagenta#8bc9f0
• terminal.ansiRed#820000
• terminal.ansiWhite#e9bac3
• terminal.ansiYellow#ffebc4
• terminal.background#6261a1
• terminal.foreground#e9bac3
• terminal.selectionBackground#b5e5e57f
• terminalCursor.background#7870a7
• terminalCursor.foreground#d2abbe
• titleBar.activeBackground#6261a1
• titleBar.activeForeground#d2abbe
• titleBar.inactiveBackground#6261a1
• titleBar.inactiveForeground#a58eb2
• walkThrough.embeddedEditorBackground#6261a1
• welcomePage.buttonBackground#7870a7
• welcomePage.buttonHoverBackground#8f7fac
• widget.shadow#6261a1

tokenColors

TextMate scopes and font styles (syntax highlighting rules).