Quantum Blue Dark Theme
Publisher: YasserElgammalThemes in package: 1
A modern, clean dark theme with deep navy blue tones and vibrant syntax highlighting
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#061528
- activityBar.border#1B3B5F
- activityBar.foreground#E2E6F0
- activityBar.inactiveForeground#7B8BA5
- activityBarBadge.background#38A1FF
- activityBarBadge.foreground#050B1A
- badge.background#1E4F8F
- badge.foreground#E2E6F0
- breadcrumb.activeSelectionForeground#38A1FF
- breadcrumb.background#050B1A
- breadcrumb.focusForeground#E2E6F0
- breadcrumb.foreground#7B8BA5
- breadcrumbPicker.background#0B2340
- button.background#1E4F8F
- button.foreground#E2E6F0
- button.hoverBackground#2A5FA5
- diffEditor.insertedLineBackground#35C9A815
- diffEditor.insertedTextBackground#35C9A820
- diffEditor.removedLineBackground#FF5C7A15
- diffEditor.removedTextBackground#FF5C7A20
- dropdown.background#0B2340
- dropdown.border#1B3B5F
- dropdown.foreground#E2E6F0
- editor.background#050B1A
- editor.foreground#E2E6F0
- editor.inactiveSelectionBackground#1E4F8F40
- editor.lineHighlightBackground#0B1A2E
- editor.lineHighlightBorder#1E4F8F00
- editor.selectionBackground#1E4F8F80
- editorBracketMatch.background#1E4F8F60
- editorBracketMatch.border#3FD6FF
- editorCursor.foreground#38A1FF
- editorError.foreground#FF5C7A
- editorGroupHeader.tabsBackground#061528
- editorGroupHeader.tabsBorder#1B3B5F
- editorHint.foreground#32C0C8
- editorHoverWidget.background#0B2340
- editorHoverWidget.border#1B3B5F
- editorIndentGuide.activeBackground#2A4A6F
- editorIndentGuide.background#1B3B5F
- editorInfo.foreground#38A1FF
- editorLineNumber.activeForeground#7B8BA5
- editorLineNumber.foreground#4A5A75
- editorRuler.foreground#1B3B5F
- editorSuggestWidget.background#0B2340
- editorSuggestWidget.border#1B3B5F
- editorSuggestWidget.foreground#E2E6F0
- editorSuggestWidget.selectedBackground#1E4F8F
- editorWarning.foreground#FFC857
- editorWhitespace.foreground#1B3B5F
- editorWidget.background#0B2340
- editorWidget.border#1B3B5F
- extensionButton.prominentBackground#1E4F8F
- extensionButton.prominentForeground#E2E6F0
- extensionButton.prominentHoverBackground#2A5FA5
- gitDecoration.addedResourceForeground#35C9A8
- gitDecoration.conflictingResourceForeground#FF8099
- gitDecoration.deletedResourceForeground#FF5C7A
- gitDecoration.ignoredResourceForeground#4A5A75
- gitDecoration.modifiedResourceForeground#FFC857
- gitDecoration.untrackedResourceForeground#32C0C8
- input.background#0B2340
- input.border#1B3B5F
- input.foreground#E2E6F0
- input.placeholderForeground#7B8BA5
- inputOption.activeBorder#38A1FF
- inputValidation.errorBackground#0B2340
- inputValidation.errorBorder#FF5C7A
- inputValidation.warningBackground#0B2340
- inputValidation.warningBorder#FFC857
- list.activeSelectionBackground#1E4F8F
- list.activeSelectionForeground#E2E6F0
- list.focusBackground#1E4F8F
- list.focusForeground#E2E6F0
- list.highlightForeground#38A1FF
- list.hoverBackground#0B2340
- list.hoverForeground#E2E6F0
- list.inactiveSelectionBackground#102A4F
- list.inactiveSelectionForeground#E2E6F0
- minimap.background#061528
- minimapSlider.activeBackground#1B3B5F80
- minimapSlider.background#1B3B5F40
- minimapSlider.hoverBackground#1B3B5F60
- notificationCenter.border#1B3B5F
- notificationCenterHeader.background#102A4F
- notifications.background#0B2340
- notifications.border#1B3B5F
- notifications.foreground#E2E6F0
- notificationToast.border#1B3B5F
- panel.background#061528
- panel.border#1B3B5F
- panelTitle.activeBorder#38A1FF
- panelTitle.activeForeground#E2E6F0
- panelTitle.inactiveForeground#7B8BA5
- peekView.border#38A1FF
- peekViewEditor.background#061528
- peekViewEditor.matchHighlightBackground#1E4F8F80
- peekViewResult.background#0B2340
- peekViewResult.matchHighlightBackground#1E4F8F80
- peekViewTitle.background#102A4F
- pickerGroup.border#1B3B5F
- pickerGroup.foreground#38A1FF
- problemsErrorIcon.foreground#FF5C7A
- problemsInfoIcon.foreground#38A1FF
- problemsWarningIcon.foreground#FFC857
- progressBar.background#38A1FF
- quickInput.background#0B2340
- quickInput.foreground#E2E6F0
- scrollbar.shadow#00000040
- scrollbarSlider.activeBackground#38A1FF60
- scrollbarSlider.background#1B3B5F60
- scrollbarSlider.hoverBackground#2A4A6F80
- sideBar.background#061528
- sideBar.border#1B3B5F
- sideBar.foreground#E2E6F0
- sideBarSectionHeader.background#0B2340
- sideBarSectionHeader.border#1B3B5F
- sideBarSectionHeader.foreground#E2E6F0
- sideBarTitle.foreground#E2E6F0
- statusBar.background#0B2340
- statusBar.border#1B3B5F
- statusBar.debuggingBackground#1E4F8F
- statusBar.debuggingForeground#E2E6F0
- statusBar.foreground#E2E6F0
- statusBar.noFolderBackground#0B2340
- statusBarItem.prominentBackground#1E4F8F
- tab.activeBackground#050B1A
- tab.activeBorder#38A1FF
- tab.activeBorderTop#38A1FF
- tab.activeForeground#E2E6F0
- tab.border#1B3B5F
- tab.hoverBackground#0B2340
- tab.hoverForeground#E2E6F0
- tab.inactiveBackground#061528
- tab.inactiveForeground#7B8BA5
- tab.unfocusedActiveBorder#1E4F8F
- terminal.ansiBlack#050B1A
- terminal.ansiBlue#38A1FF
- terminal.ansiBrightBlack#4A5A75
- terminal.ansiBrightBlue#6EC8FF
- terminal.ansiBrightCyan#32C0C8
- terminal.ansiBrightGreen#5EDCB9
- terminal.ansiBrightMagenta#A5B3FF
- terminal.ansiBrightRed#FF8099
- terminal.ansiBrightWhite#FFFFFF
- terminal.ansiBrightYellow#FFD67A
- terminal.ansiCyan#3FD6FF
- terminal.ansiGreen#35C9A8
- terminal.ansiMagenta#8C9CFF
- terminal.ansiRed#FF5C7A
- terminal.ansiWhite#E2E6F0
- terminal.ansiYellow#FFC857
- terminal.background#050B1A
- terminal.foreground#E2E6F0
- titleBar.activeBackground#061528
- titleBar.activeForeground#E2E6F0
- titleBar.border#1B3B5F
- titleBar.inactiveBackground#050B1A
- titleBar.inactiveForeground#7B8BA5
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #7B8BA5 | italic |
| keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical, storage.type, storage.modifier | #38A1FF | — |
| string, string.quoted, string.template | #32C0C8 | — |
| constant.numeric, constant.language.boolean, constant.language.null, constant.language.undefined | #3FD6FF | — |
| entity.name.function, support.function, meta.function-call | #6EC8FF | — |
| variable, variable.parameter, variable.other, meta.definition.variable | #D7E3FF | — |
| entity.name.type, entity.name.class, support.type, support.class, entity.name.interface | #8C9CFF | — |
| constant.language, variable.other.constant, variable.other.enummember, support.constant | #35C9A8 | — |
| entity.name.tag, meta.tag | #38A1FF | — |
| entity.other.attribute-name | #6EC8FF | — |
| punctuation, meta.brace, punctuation.definition | #A0A8BF | — |
| keyword.operator, keyword.operator.arithmetic, keyword.operator.assignment, keyword.operator.comparison | #3FD6FF | — |
| support.type.property-name, meta.object-literal.key | #D7E3FF | — |
| variable.language.this, variable.language.super | #8C9CFF | italic |
| markup.heading | #38A1FF | bold |
| markup.bold | #E2E6F0 | bold |
| markup.italic | #E2E6F0 | italic |
| markup.inline.raw, markup.fenced_code | #32C0C8 | — |
| markup.list | #6EC8FF | — |
| markup.underline.link | #38A1FF | underline |
| invalid, invalid.illegal | #FF5C7A | — |
| invalid.deprecated | #FFC857 | — |