Bento Dark Theme (Monkeytype Inspired)

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#263041
• activityBar.foreground#fffaf8
• activityBar.inactiveForeground#9ab0bf
• activityBarBadge.background#ff7a90
• activityBarBadge.foreground#2d394d
• badge.background#ff7a90
• badge.foreground#2d394d
• breadcrumb.activeSelectionForeground#fffaf8
• breadcrumb.background#263041
• breadcrumb.focusForeground#ff7a90
• breadcrumb.foreground#9ab0bf
• button.background#4a768d
• button.foreground#fffaf8
• button.hoverBackground#5b879f
• button.secondaryBackground#263041
• button.secondaryForeground#fffaf8
• button.secondaryHoverBackground#2d394d
• checkbox.background#263041
• checkbox.border#4a768d
• checkbox.foreground#ff7a90
• descriptionForeground#9ab0bf
• diffEditor.diagonalFill#4a768d44
• diffEditor.insertedLineBackground#6db89818
• diffEditor.insertedTextBackground#6db89830
• diffEditor.removedLineBackground#ee2a3a18
• diffEditor.removedTextBackground#ee2a3a30
• dropdown.background#263041
• dropdown.border#4a768d
• dropdown.foreground#fffaf8
• editor.background#2d394d
• editor.findMatchBackground#e8b96e8a
• editor.findMatchHighlightBackground#e8b96e40
• editor.foreground#fffaf8
• editor.hoverHighlightBackground#4a768d40
• editor.lineHighlightBackground#4a768d22
• editor.lineHighlightBorder#4a768d
• editor.selectionBackground#4a768d66
• editor.selectionHighlightBackground#4a768d40
• editor.wordHighlightBackground#4a768d40
• editor.wordHighlightStrongBackground#ff7a9040
• editorBracketHighlight.foreground1#ff7a90
• editorBracketHighlight.foreground2#4a768d
• editorBracketHighlight.foreground3#fffaf8
• editorCursor.foreground#ff7a90
• editorGroup.border#4a768d
• editorGroupHeader.border#4a768d
• editorGroupHeader.noTabsBackground#263041
• editorGroupHeader.tabsBackground#263041
• editorGroupHeader.tabsBorder#4a768d
• editorGutter.addedBackground#6db89880
• editorGutter.deletedBackground#ee2a3a80
• editorGutter.modifiedBackground#569cd680
• editorHoverWidget.background#263041
• editorHoverWidget.border#4a768d
• editorIndentGuide.activeBackground1#4a768d
• editorIndentGuide.background1#263041
• editorInlayHint.background#263041
• editorInlayHint.foreground#9ab0bf
• editorLineNumber.activeForeground#ff7a90
• editorLineNumber.foreground#4a768d
• editorOverviewRuler.addedForeground#6db898
• editorOverviewRuler.deletedForeground#ee2a3a
• editorOverviewRuler.modifiedForeground#569cd6
• editorStickyScroll.background#263041
• editorStickyScroll.border#4a768d
• editorStickyScrollHover.background#4a768d33
• editorSuggestWidget.background#263041
• editorSuggestWidget.border#4a768d
• editorSuggestWidget.foreground#fffaf8
• editorSuggestWidget.selectedBackground#4a768d66
• editorWhitespace.foreground#4a768d66
• editorWidget.background#263041
• editorWidget.border#4a768d
• errorForeground#ee2a3a
• focusBorder#ff7a90
• foreground#fffaf8
• gitDecoration.addedResourceForeground#6db898
• gitDecoration.conflictingResourceForeground#ff9258
• gitDecoration.deletedResourceForeground#ee2a3a
• gitDecoration.ignoredResourceForeground#4a768d
• gitDecoration.modifiedResourceForeground#569cd6
• gitDecoration.renamedResourceForeground#79a0b4
• gitDecoration.stageDeletedResourceForeground#f07070
• gitDecoration.stageModifiedResourceForeground#7ab8e8
• gitDecoration.submoduleResourceForeground#9ab0bf
• gitDecoration.untrackedResourceForeground#7ec8a4
• icon.foreground#fffaf8
• input.background#263041
• input.border#4a768d
• input.foreground#fffaf8
• input.placeholderForeground#9ab0bf
• inputOption.activeBorder#ff7a90
• inputValidation.errorBackground#2d394d
• inputValidation.errorBorder#ee2a3a
• inputValidation.infoBackground#263041
• inputValidation.infoBorder#4a768d
• inputValidation.warningBackground#2d394d
• inputValidation.warningBorder#ff95a6
• list.activeSelectionBackground#4a768d66
• list.activeSelectionForeground#fffaf8
• list.focusBackground#4a768d66
• list.focusForeground#fffaf8
• list.highlightForeground#ff7a90
• list.hoverBackground#4a768d33
• list.inactiveSelectionBackground#4a768d40
• list.inactiveSelectionForeground#fffaf8
• menu.background#263041
• menu.foreground#fffaf8
• menu.selectionBackground#4a768d66
• menu.selectionForeground#fffaf8
• menu.separatorBackground#4a768d
• minimap.background#2d394d
• minimap.errorHighlight#ee2a3a
• minimap.findMatchHighlight#ff7a90aa
• minimap.selectionHighlight#4a768d88
• minimap.warningHighlight#ff95a6
• minimapGutter.addedBackground#6db898
• minimapGutter.deletedBackground#ee2a3a
• minimapGutter.modifiedBackground#569cd6
• notificationCenterHeader.background#263041
• notificationCenterHeader.foreground#fffaf8
• notifications.background#263041
• notifications.border#4a768d
• notifications.foreground#fffaf8
• notificationsErrorIcon.foreground#ee2a3a
• notificationsInfoIcon.foreground#79a0b4
• notificationsWarningIcon.foreground#ff95a6
• panel.background#2d394d
• panel.border#4a768d
• panelTitle.activeForeground#ff7a90
• panelTitle.inactiveForeground#9ab0bf
• peekViewEditor.background#2d394d
• peekViewEditor.matchHighlightBackground#ff7a9040
• peekViewResult.background#263041
• peekViewResult.matchHighlightBackground#ff7a9040
• peekViewResult.selectionBackground#4a768d66
• peekViewTitle.background#263041
• peekViewTitleDescription.foreground#9ab0bf
• peekViewTitleLabel.foreground#fffaf8
• pickerGroup.border#4a768d
• pickerGroup.foreground#ff7a90
• progressBar.background#ff7a90
• quickInput.background#263041
• quickInput.foreground#fffaf8
• quickInputList.focusBackground#4a768d66
• quickInputList.focusForeground#fffaf8
• scrollbar.shadow#263041
• scrollbarSlider.activeBackground#5b879faa
• scrollbarSlider.background#4a768d55
• scrollbarSlider.hoverBackground#4a768d88
• selection.background#4a768d66
• settings.checkboxBackground#263041
• settings.checkboxBorder#4a768d
• settings.checkboxForeground#ff7a90
• settings.dropdownBackground#263041
• settings.dropdownBorder#4a768d
• settings.dropdownForeground#fffaf8
• settings.headerForeground#ff7a90
• settings.modifiedItemIndicator#ff7a90
• settings.numberInputBackground#263041
• settings.numberInputBorder#4a768d
• settings.numberInputForeground#fffaf8
• settings.textInputBackground#263041
• settings.textInputBorder#4a768d
• settings.textInputForeground#fffaf8
• sideBar.background#263041
• sideBar.border#4a768d
• sideBar.foreground#fffaf8
• sideBarSectionHeader.background#2d394d
• sideBarSectionHeader.foreground#ff7a90
• sideBarTitle.foreground#ff7a90
• statusBar.background#263041
• statusBar.debuggingBackground#ff7a90
• statusBar.debuggingForeground#2d394d
• statusBar.foreground#fffaf8
• statusBar.noFolderBackground#263041
• tab.activeBackground#2d394d
• tab.activeBorder#4a768d
• tab.activeBorderTop#ff7a90
• tab.activeForeground#fffaf8
• tab.border#4a768d
• tab.hoverBackground#2d394d
• tab.hoverForeground#fffaf8
• tab.inactiveBackground#263041
• tab.inactiveForeground#9ab0bf
• tab.unfocusedActiveBackground#2d394d
• tab.unfocusedActiveBorderTop#4a768d
• tab.unfocusedActiveForeground#9ab0bf
• tab.unfocusedInactiveBackground#263041
• tab.unfocusedInactiveForeground#9ab0bf
• terminal.ansiBlack#263041
• terminal.ansiBlue#569cd6
• terminal.ansiBrightBlack#2d394d
• terminal.ansiBrightBlue#7ab8e8
• terminal.ansiBrightCyan#9ab0bf
• terminal.ansiBrightGreen#7ec8a4
• terminal.ansiBrightMagenta#ff9fb0
• terminal.ansiBrightRed#f04040
• terminal.ansiBrightWhite#ffffff
• terminal.ansiBrightYellow#f0cc88
• terminal.ansiCyan#79a0b4
• terminal.ansiGreen#6db898
• terminal.ansiMagenta#ff7a90
• terminal.ansiRed#ee2a3a
• terminal.ansiWhite#fffaf8
• terminal.ansiYellow#e8b96e
• terminal.background#2d394d
• terminal.foreground#fffaf8
• terminalCursor.foreground#ff7a90
• textBlockQuote.background#263041
• textBlockQuote.border#4a768d
• textCodeBlock.background#263041
• textLink.activeForeground#ff9fb0
• textLink.foreground#ff7a90
• textPreformat.foreground#fffaf8
• textSeparator.foreground#4a768d
• titleBar.activeBackground#263041
• titleBar.activeForeground#fffaf8
• titleBar.inactiveBackground#2d394d
• titleBar.inactiveForeground#9ab0bf

tokenColors

TextMate scopes and font styles (syntax highlighting rules).