Deep Blue Dark Theme
Publisher: Lorenzo AdreaniThemes in package: 3
A clean and minimal dark blue theme for VS Code. Deep Blue delivers a consistent UI, smooth contrast and a distraction-free coding experience. Includes Flat and Night variants.
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.background#0d1115
- activityBar.border#0d1115
- activityBar.foreground#d3dae3
- activityBar.inactiveForeground#9298a5
- activityBarBadge.background#2b5278
- activityBarBadge.foreground#d3dae3
- badge.background#2b5278
- badge.foreground#d3dae3
- button.background#2b3948
- button.foreground#d3dae3
- button.hoverBackground#35506c
- button.secondaryBackground#202933
- button.secondaryForeground#d3dae3
- button.secondaryHoverBackground#2b3948
- commandCenter.activeBackground#202933
- commandCenter.background#0d1115
- commandCenter.border#1b2128
- commandCenter.foreground#d3dae3
- descriptionForeground#9298a5
- disabledForeground#9298a5
- dropdown.background#0d1115
- dropdown.border#1b2128
- dropdown.foreground#d3dae3
- editor.background#0d1115
- editor.findMatchBackground#2b5278aa
- editor.findMatchHighlightBackground#4c637d55
- editor.foreground#d3dae3
- editor.hoverHighlightBackground#10151a
- editor.inactiveSelectionBackground#4c637d44
- editor.lineHighlightBackground#10151a
- editor.lineHighlightBorder#00000000
- editor.rangeHighlightBackground#10151a
- editor.selectionBackground#2b527866
- editor.selectionHighlightBackground#4c637d33
- editor.wordHighlightBackground#4c637d33
- editor.wordHighlightStrongBackground#4c637d55
- editorBracketMatch.background#4c637d33
- editorBracketMatch.border#466799
- editorCodeLens.foreground#9298a5
- editorCursor.foreground#d3dae3
- editorGroup.border#0d1115
- editorGroupHeader.noTabsBackground#0d1115
- editorGroupHeader.tabsBackground#0d1115
- editorGroupHeader.tabsBorder#0d1115
- editorHoverWidget.background#0d1115
- editorHoverWidget.border#1b2128
- editorHoverWidget.foreground#d3dae3
- editorIndentGuide.activeBackground1#4c637d
- editorIndentGuide.background1#10151a
- editorLineNumber.activeForeground#9298a5
- editorLineNumber.foreground#666a73
- editorLink.activeForeground#7dcfff
- editorOverviewRuler.border#00000000
- editorRuler.foreground#2b3948
- editorSuggestWidget.background#0d1115
- editorSuggestWidget.border#1b2128
- editorSuggestWidget.foreground#d3dae3
- editorSuggestWidget.highlightForeground#5d88ca
- editorSuggestWidget.selectedBackground#202933
- editorSuggestWidget.selectedForeground#d3dae3
- editorWhitespace.foreground#2b3948
- editorWidget.background#0d1115
- editorWidget.border#1b2128
- errorForeground#da4453
- focusBorder#2b5278
- foreground#d3dae3
- icon.foreground#9298a5
- input.background#0d1115
- input.border#1b2128
- input.foreground#d3dae3
- input.placeholderForeground#7f8793
- inputOption.activeBackground#2b527833
- inputOption.activeBorder#2b5278
- inputOption.activeForeground#d3dae3
- inputValidation.errorBackground#2a1418
- inputValidation.errorBorder#da4453
- inputValidation.infoBackground#162331
- inputValidation.infoBorder#2b5278
- inputValidation.warningBackground#3a2505
- inputValidation.warningBorder#f67400
- list.activeSelectionBackground#2b5278
- list.activeSelectionForeground#d3dae3
- list.focusBackground#2b5278
- list.focusForeground#d3dae3
- list.focusOutline#00000000
- list.highlightForeground#5d88ca
- list.hoverBackground#202933
- list.hoverForeground#d3dae3
- list.inactiveFocusOutline#00000000
- list.inactiveSelectionBackground#4c637d55
- list.inactiveSelectionForeground#d3dae3
- menu.background#0d1115
- menu.border#1b2128
- menu.foreground#d3dae3
- menu.selectionBackground#202933
- menu.selectionForeground#d3dae3
- menu.separatorBackground#1b2128
- minimap.background#0d1115
- notificationCenterHeader.background#141a21
- notificationCenterHeader.foreground#d3dae3
- notifications.background#0d1115
- notifications.border#1b2128
- notifications.foreground#d3dae3
- notificationToast.border#1b2128
- panel.background#10151a
- panel.border#0d1115
- panelTitle.activeBorder#2b5278
- panelTitle.activeForeground#d3dae3
- panelTitle.inactiveForeground#9298a5
- peekView.border#2b5278
- peekViewEditor.background#0d1115
- peekViewEditor.matchHighlightBackground#4c637d55
- peekViewResult.background#0d1115
- peekViewResult.fileForeground#d3dae3
- peekViewResult.lineForeground#9298a5
- peekViewResult.matchHighlightBackground#4c637d55
- peekViewTitle.background#0d1115
- peekViewTitleDescription.foreground#9298a5
- peekViewTitleLabel.foreground#d3dae3
- progressBar.background#2b5278
- quickInput.background#0d1115
- quickInput.foreground#d3dae3
- quickInputList.focusBackground#202933
- quickInputTitle.background#0d1115
- scrollbar.shadow#00000066
- scrollbarSlider.activeBackground#4c637daa
- scrollbarSlider.background#4c637d66
- scrollbarSlider.hoverBackground#4c637d88
- selection.background#2b527888
- settings.checkboxBackground#0d1115
- settings.checkboxBorder#1b2128
- settings.dropdownBackground#0d1115
- settings.dropdownBorder#1b2128
- settings.modifiedItemIndicator#5d88ca
- settings.numberInputBackground#0d1115
- settings.numberInputBorder#1b2128
- settings.textInputBackground#0d1115
- settings.textInputBorder#1b2128
- sideBar.background#10151a
- sideBar.border#0d1115
- sideBar.foreground#d3dae3
- sideBarSectionHeader.background#0d1115
- sideBarSectionHeader.foreground#d3dae3
- sideBarTitle.foreground#d3dae3
- statusBar.background#141a21
- statusBar.border#141a21
- statusBar.debuggingBackground#2b5278
- statusBar.debuggingForeground#d3dae3
- statusBar.foreground#d3dae3
- statusBar.noFolderBackground#141a21
- statusBarItem.hoverBackground#202933
- tab.activeBackground#0d1115
- tab.activeBorderTop#00000000
- tab.activeForeground#d3dae3
- tab.border#0d1115
- tab.hoverBackground#141a21
- tab.inactiveBackground#0d1115
- tab.inactiveForeground#9298a5
- tab.unfocusedActiveBackground#0d1115
- tab.unfocusedActiveForeground#c6ced9
- terminal.background#0d1115
- terminal.foreground#d3dae3
- textBlockQuote.background#141a21
- textBlockQuote.border#2b5278
- textCodeBlock.background#141a21
- textLink.activeForeground#7aa2d1
- textLink.foreground#5d88ca
- textPreformat.foreground#9ece6a
- textSeparator.foreground#2b3948
- titleBar.activeBackground#0d1115
- titleBar.activeForeground#d3dae3
- titleBar.border#0d1115
- titleBar.inactiveBackground#0d1115
- titleBar.inactiveForeground#666a73
- toolbar.activeBackground#2b3948
- toolbar.hoverBackground#202933
- welcomePage.tileBackground#141a21
- welcomePage.tileHoverBackground#202933
- widget.border#1b2128
- widget.shadow#00000066
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #68727e | — |
| string, string.quoted, string.template, string.regexp | #8fcb6c | — |
| constant.numeric, constant.language.boolean, constant.language.null, constant.language.undefined | #de7c2c | — |
| keyword, storage, storage.type, storage.modifier | #4f79b7 | — |
| entity.name.function, support.function, meta.function-call, variable.function | #62b4d8 | — |
| entity.name.type, entity.name.class, support.class, support.type, entity.name.namespace | #9db2c8 | — |
| variable, meta.definition.variable.name, support.variable | #d1d8e0 | — |
| variable.parameter | #bcc7d2 | — |
| entity.name.tag, meta.tag, punctuation.definition.tag | #4f79b7 | — |
| entity.other.attribute-name | #62b4d8 | — |
| keyword.operator, punctuation.separator, punctuation.terminator | #8fa0b3 | — |
| constant.character.escape, string.regexp.character-class, string.regexp constant.character.escape | #d7b65f | — |
| invalid, invalid.illegal, invalid.deprecated | #d14d57 | — |
| markup.heading, markup.bold, markup.italic | #8fa9c2 | — |
| markup.inline.raw, markup.fenced_code.block | #8fcb6c | — |