DevmateBB

Color themes

• 

  DevmateBB

• 

  DevmateBB Soft

• 

  DevmateBB Vibrant

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#d0bcff
• activityBar.background#141218
• activityBar.foreground#d0bcff
• activityBar.inactiveForeground#cac4d0
• activityBarBadge.background#4f378b
• activityBarBadge.foreground#e6e0e9
• button.background#d0bcff
• button.foreground#381e72
• button.hoverBackground#4f378b
• button.secondaryBackground#ccc2dc
• button.secondaryForeground#332d41
• button.secondaryHoverBackground#4a4458
• descriptionForeground#cac4d0
• diffEditor.insertedTextBackground#4a4458
• diffEditor.removedTextBackground#49454f
• dropdown.background#49454f
• dropdown.border#938f99
• dropdown.foreground#e6e0e9
• editor.background#141218
• editor.findMatchBackground#4a4458
• editor.findMatchHighlightBackground#49454f
• editor.foreground#e6e0e9
• editor.inactiveSelectionBackground#49454f
• editor.lineHighlightBackground#49454f
• editor.selectionBackground#4f378b
• editor.selectionHighlightBackground#4a4458
• editor.wordHighlightBackground#49454f
• editor.wordHighlightStrongBackground#4f378b
• editorBracketMatch.background#49454f
• editorBracketMatch.border#d0bcff
• editorCursor.foreground#d0bcff
• editorError.foreground#f2b8b5
• editorGutter.addedBackground#ccc2dc
• editorGutter.background#141218
• editorGutter.deletedBackground#f2b8b5
• editorGutter.modifiedBackground#d0bcff
• editorHint.foreground#d0bcff
• editorIndentGuide.activeBackground#d0bcff
• editorIndentGuide.background#49454f
• editorInfo.foreground#ccc2dc
• editorLineNumber.activeForeground#d0bcff
• editorLineNumber.foreground#49454f
• editorRuler.foreground#49454f
• editorWarning.foreground#efb8c8
• editorWhitespace.foreground#49454f
• errorForeground#f2b8b5
• focusBorder#d0bcff
• foreground#e6e0e9
• icon.foreground#cac4d0
• input.background#49454f
• input.border#938f99
• input.foreground#e6e0e9
• input.placeholderForeground#cac4d0
• inputOption.activeBackground#4f378b
• inputOption.activeBorder#d0bcff
• inputOption.activeForeground#e6e0e9
• list.activeSelectionBackground#4f378b
• list.activeSelectionForeground#e6e0e9
• list.highlightForeground#d0bcff
• list.hoverBackground#4a4458
• list.inactiveSelectionBackground#49454f
• minimap.background#141218
• minimap.errorHighlight#f2b8b5
• minimap.findMatchHighlight#4f378b
• minimap.selectionHighlight#4a4458
• minimap.warningHighlight#efb8c8
• notificationCenterHeader.background#4f378b
• notifications.background#141218
• notifications.foreground#e6e0e9
• panel.background#141218
• panel.border#938f99
• panelTitle.activeBorder#d0bcff
• panelTitle.activeForeground#d0bcff
• panelTitle.inactiveForeground#cac4d0
• peekView.border#938f99
• peekViewEditor.background#49454f
• peekViewResult.background#141218
• peekViewResult.selectionBackground#4f378b
• peekViewResult.selectionForeground#e6e0e9
• peekViewTitle.background#49454f
• scrollbarSlider.activeBackground#d0bcff80
• scrollbarSlider.background#49454f80
• scrollbarSlider.hoverBackground#938f9980
• sideBar.background#141218
• sideBar.foreground#e6e0e9
• sideBarSectionHeader.background#49454f
• sideBarSectionHeader.foreground#e6e0e9
• sideBarTitle.foreground#e6e0e9
• statusBar.background#141218
• statusBar.debuggingBackground#efb8c8
• statusBar.debuggingForeground#141218
• statusBar.foreground#e6e0e9
• statusBar.noFolderBackground#49454f
• tab.activeBackground#49454f
• tab.activeBorderTop#d0bcff
• tab.activeForeground#d0bcff
• tab.border#49454f
• tab.hoverBackground#4a4458
• tab.hoverForeground#e6e0e9
• tab.inactiveBackground#141218
• tab.inactiveForeground#cac4d0
• terminal.ansiBlack#141218
• terminal.ansiBlue#d0bcff
• terminal.ansiBrightBlack#49454f
• terminal.ansiBrightBlue#d0bcff
• terminal.ansiBrightCyan#4a4458
• terminal.ansiBrightGreen#ccc2dc
• terminal.ansiBrightMagenta#4f378b
• terminal.ansiBrightRed#f2b8b5
• terminal.ansiBrightWhite#e6e0e9
• terminal.ansiBrightYellow#efb8c8
• terminal.ansiCyan#4a4458
• terminal.ansiGreen#ccc2dc
• terminal.ansiMagenta#4f378b
• terminal.ansiRed#f2b8b5
• terminal.ansiWhite#e6e0e9
• terminal.ansiYellow#efb8c8
• terminal.background#141218
• terminal.foreground#e6e0e9
• terminalCursor.foreground#d0bcff
• titleBar.activeBackground#141218
• titleBar.activeForeground#e6e0e9
• titleBar.inactiveBackground#49454f
• titleBar.inactiveForeground#cac4d0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).