Dark Grey Color Theme
Publisher: DarkMannnThemes in package: 1
Dark, minimalistic VSCode theme with almost no colors other than a beautiful and calming grey.
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.activeBackground#000000
- activityBar.background#000000
- activityBar.border#dcdcdc00
- activityBar.foreground#808080
- activityBar.inactiveForeground#343434
- activityBarBadge.background#808080
- activityBarBadge.foreground#dcdcdc
- badge.background#808080
- badge.foreground#dcdcdc
- breadcrumb.activeSelectionForeground#dcdcdc
- breadcrumb.background#000000
- breadcrumb.focusForeground#dcdcdc
- breadcrumb.foreground#343434
- button.background#808080
- button.foreground#dcdcdc
- button.hoverBackground#808080a7
- button.secondaryBackground#dcdcdc
- button.secondaryForeground#000000
- button.secondaryHoverBackground#dcdcdcd1
- checkbox.background#000000
- checkbox.border#343434
- checkbox.foreground#dcdcdc
- debugExceptionWidget.background#1d1d1d
- debugExceptionWidget.border#dcdcdc00
- debugToolBar.background#1d1d1d
- debugToolBar.border#dcdcdc00
- diffEditor.border#343434
- diffEditor.insertedTextBackground#66b28b33
- diffEditor.insertedTextBorder#dcdcdc00
- diffEditor.removedTextBackground#ff6e6e33
- dropdown.background#000000
- dropdown.border#343434
- dropdown.foreground#dcdcdc
- editor.background#000000
- editor.findMatchBackground#000000
- editor.findMatchBorder#808080
- editor.findMatchHighlightBackground#dcdcdc00
- editor.findMatchHighlightBorder#dcdcdc
- editor.findRangeHighlightBackground#5454544a
- editor.findRangeHighlightBorder#dcdcdc00
- editor.foldBackground#34343466
- editor.foreground#808080
- editor.hoverHighlightBackground#343434aa
- editor.inactiveSelectionBackground#3434344a
- editor.lineHighlightBackground#1d1d1d
- editor.lineHighlightBorder#dcdcdc00
- editor.rangeHighlightBackground#343434b1
- editor.rangeHighlightBorder#dcdcdc00
- editor.selectionBackground#3434347a
- editor.selectionHighlightBackground#3434347a
- editor.selectionHighlightBorder#dcdcdc00
- editor.wordHighlightBackground#343434aa
- editor.wordHighlightBorder#dcdcdc00
- editor.wordHighlightStrongBackground#3434347a
- editor.wordHighlightStrongBorder#dcdcdc00
- editorBracketHighlight.foreground1#1d1d1d
- editorBracketHighlight.foreground2#343434
- editorBracketHighlight.foreground3#1d1d1d
- editorBracketHighlight.foreground4#343434
- editorBracketHighlight.foreground5#1d1d1d
- editorBracketHighlight.foreground6#343434
- editorBracketHighlight.unexpectedBracket.foreground#343434
- editorBracketMatch.background#343434af
- editorBracketMatch.border#dcdcdc00
- editorBracketPairGuide.background1#1d1d1d
- editorBracketPairGuide.background2#343434
- editorBracketPairGuide.background3#1d1d1d
- editorBracketPairGuide.background4#343434
- editorBracketPairGuide.background5#1d1d1d
- editorBracketPairGuide.background6#343434
- editorCodeLens.foreground#343434
- editorCursor.background#000000
- editorCursor.foreground#dcdcdc
- editorError.background#B73A3400
- editorError.border#dcdcdc00
- editorError.foreground#ff8080c5
- editorGroup.border#dcdcdc00
- editorGroup.emptyBackground#000000
- editorGroupHeader.border#dcdcdc00
- editorGroupHeader.tabsBackground#000000
- editorGroupHeader.tabsBorder#dcdcdc00
- editorGutter.addedBackground#37b05b
- editorGutter.background#000000
- editorGutter.commentRangeForeground#dcdcdc
- editorGutter.deletedBackground#ff8080
- editorGutter.foldingControlForeground#dcdcdc
- editorGutter.modifiedBackground#7895c7
- editorHoverWidget.background#000000
- editorHoverWidget.border#343434
- editorHoverWidget.foreground#808080
- editorIndentGuide.activeBackground1#808080
- editorIndentGuide.background1#343434aa
- editorInfo.background#4490BF00
- editorInfo.border#4490BF00
- editorInfo.foreground#7895c7c5
- editorLineNumber.activeForeground#dcdcdc
- editorLineNumber.foreground#343434
- editorLink.activeForeground#808080
- editorMarkerNavigation.background#000000
- editorMarkerNavigationError.background#ff8080
- editorMarkerNavigationInfo.background#7895c7
- editorMarkerNavigationWarning.background#eded88
- editorOverviewRuler.background#dcdcdc00
- editorOverviewRuler.border#dcdcdc00
- editorRuler.foreground#343434
- editorSuggestWidget.background#000000
- editorSuggestWidget.border#343434
- editorSuggestWidget.foreground#dcdcdc
- editorSuggestWidget.highlightForeground#808080
- editorSuggestWidget.selectedBackground#1d1d1d
- editorWarning.background#A9904000
- editorWarning.border#dcdcdc00
- editorWarning.foreground#eded88c5
- editorWhitespace.foreground#9f9f9f7c
- editorWidget.background#000000
- editorWidget.foreground#dcdcdc
- editorWidget.resizeBorder#808080
- focusBorder#808080
- foreground#dcdcdc
- gitDecoration.addedResourceForeground#81b88b
- gitDecoration.conflictingResourceForeground#8282c4
- gitDecoration.deletedResourceForeground#c06c5d
- gitDecoration.ignoredResourceForeground#8c8c8c
- gitDecoration.modifiedResourceForeground#e2c08d
- gitDecoration.stageDeletedResourceForeground#9f4434
- gitDecoration.stageModifiedResourceForeground#ab7f3d
- gitDecoration.submoduleResourceForeground#4b7ead
- gitDecoration.untrackedResourceForeground#4b8a61
- icon.foreground#dcdcdc
- input.background#000000
- input.border#343434
- input.foreground#dcdcdc
- input.placeholderForeground#343434
- inputOption.activeBackground#343434
- inputOption.activeBorder#dcdcdc00
- inputOption.activeForeground#dcdcdc
- list.activeSelectionBackground#343434
- list.activeSelectionForeground#dcdcdc
- list.dropBackground#1d1d1d
- list.focusBackground#1d1d1d
- list.focusForeground#dcdcdc
- list.highlightForeground#808080
- list.hoverBackground#343434
- list.hoverForeground#dcdcdc
- list.inactiveSelectionBackground#1d1d1d
- list.inactiveSelectionForeground#dcdcdc
- listFilterWidget.background#343434
- listFilterWidget.noMatchesOutline#dcdcdc00
- listFilterWidget.outline#dcdcdc00
- menu.background#000000
- menu.border#343434
- menu.foreground#dcdcdc
- menu.selectionBackground#343434
- menu.selectionBorder#dcdcdc00
- menu.selectionForeground#dcdcdc
- menu.separatorBackground#343434
- menubar.selectionBackground#1d1d1d
- menubar.selectionBorder#dcdcdc00
- menubar.selectionForeground#dcdcdc
- merge.commonContentBackground#282828aa
- merge.commonHeaderBackground#383838aa
- merge.currentContentBackground#27403Baa
- merge.currentHeaderBackground#367366aa
- merge.incomingContentBackground#28384Baa
- merge.incomingHeaderBackground#395F8Faa
- minimap.background#000000
- minimap.errorHighlight#ff8080c5
- minimap.findMatchHighlight#000000aa
- minimap.selectionHighlight#3434347a
- minimap.warningHighlight#eded88c5
- minimapGutter.addedBackground#37b05b
- minimapGutter.deletedBackground#ff8080
- minimapGutter.modifiedBackground#7895c7
- notificationCenter.border#343434
- notificationCenterHeader.background#000000
- notificationCenterHeader.foreground#808080
- notifications.background#000000
- notifications.border#343434
- notifications.foreground#dcdcdc
- notificationsErrorIcon.foreground#ff8080
- notificationsInfoIcon.foreground#7895c7
- notificationsWarningIcon.foreground#eded88
- notificationToast.border#dcdcdc00
- panel.background#000000
- panel.border#343434
- panelSection.border#343434
- panelTitle.activeBorder#808080
- panelTitle.activeForeground#808080
- panelTitle.inactiveForeground#343434
- peekView.border#808080
- peekViewEditor.background#1d1d1d
- peekViewEditor.matchHighlightBackground#8080803d
- peekViewEditor.matchHighlightBorder#dcdcdc00
- peekViewEditorGutter.background#1d1d1d
- peekViewResult.background#000000
- peekViewResult.fileForeground#dcdcdc
- peekViewResult.lineForeground#949494
- peekViewResult.matchHighlightBackground#8080803d
- peekViewResult.selectionBackground#8080803d
- peekViewResult.selectionForeground#dcdcdc
- peekViewTitle.background#000000
- peekViewTitleDescription.foreground#808080
- peekViewTitleLabel.foreground#dcdcdc
- pickerGroup.border#80808000
- pickerGroup.foreground#808080
- progressBar.background#808080
- scrollbar.shadow#343434
- scrollbarSlider.activeBackground#bfbfbf66
- scrollbarSlider.background#343434
- scrollbarSlider.hoverBackground#b6b6b6b3
- selection.background#343434
- settings.focusedRowBackground#ffffff07
- settings.headerForeground#dcdcdc
- sideBar.background#000000
- sideBar.border#dcdcdc00
- sideBar.dropBackground#1d1d1d
- sideBar.foreground#dcdcdc
- sideBarSectionHeader.background#dcdcdc00
- sideBarSectionHeader.border#dcdcdc00
- sideBarSectionHeader.foreground#dcdcdc
- sideBarTitle.foreground#808080
- statusBar.background#808080
- statusBar.border#dcdcdc00
- statusBar.debuggingBackground#343434
- statusBar.debuggingBorder#dcdcdc00
- statusBar.debuggingForeground#dcdcdc
- statusBar.foreground#dcdcdc
- statusBar.noFolderBackground#dcdcdc
- statusBar.noFolderBorder#dcdcdc00
- statusBar.noFolderForeground#000000
- statusBarItem.activeBackground#FFFFFF25
- statusBarItem.hoverBackground#343434
- statusBarItem.remoteBackground#000000
- statusBarItem.remoteForeground#dcdcdc
- tab.activeBackground#000000
- tab.activeBorder#808080
- tab.activeBorderTop#000000
- tab.activeForeground#dcdcdc
- tab.border#80808000
- tab.hoverBackground#1d1d1d
- tab.hoverBorder#dcdcdc00
- tab.hoverForeground#dcdcdc
- tab.inactiveBackground#000000
- tab.inactiveForeground#343434
- terminal.ansiBlack#343434
- terminal.ansiBlue#7895c7
- terminal.ansiBrightBlack#808080
- terminal.ansiBrightBlue#74BCFF
- terminal.ansiBrightCyan#00ffff
- terminal.ansiBrightGreen#67FF8A
- terminal.ansiBrightMagenta#EC84FF
- terminal.ansiBrightRed#e64444
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#d9ce9b
- terminal.ansiCyan#50d2f7
- terminal.ansiGreen#33D057
- terminal.ansiMagenta#E557F9
- terminal.ansiRed#ff8080
- terminal.ansiWhite#dddddd
- terminal.ansiYellow#eded88
- terminal.border#343434
- terminal.foreground#dcdcdc
- terminal.selectionBackground#1d1d1d
- terminalCursor.background#1d1d1d
- terminalCursor.foreground#dcdcdc
- textLink.activeForeground#808080a7
- textLink.foreground#808080
- titleBar.activeBackground#000000
- titleBar.activeForeground#dcdcdc
- titleBar.border#dcdcdc00
- titleBar.inactiveBackground#1d1d1d
- titleBar.inactiveForeground#cccccc
- tree.indentGuidesStroke#343434
- walkThrough.embeddedEditorBackground#00000050
- widget.shadow#343434
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| constant.language.null.ts, constant.language.null.js, constant.language.undefined.ts, constant.language.undefined.js, constant.language.boolean.true.ts, constant.language.boolean.true.js, constant.language.boolean.false.ts, constant.language.boolean.false.js, constant.language.nan.ts, constant.language.nan.js, constant.language.infinity.ts, constant.language.infinity.js, constant.language.void.ts, constant.language.void.js | #dcdcdc | — |
| source | #808080 | — |
| support.type.property-name.css | #808080 | — |
| entity.other.attribute-name.id.css, entity.name.tag.css, meta.property-value.css, support.constant.property-value.css, punctuation.definition.entity.css | #dcdcdc | — |
| text.html.derivative, entity.name.tag.html | #dcdcdc | — |
| entity.name.type.class | #dcdcdc | — |
| entity.name.type.interface, entity.name.type | #dcdcdc | — |
| entity.name.type.struct | #dcdcdc | — |
| entity.name.type.enum | #dcdcdc | — |
| meta.object-literal.key | #808080 | — |
| entity.name.function.method, meta.function.method | #808080 | — |
| entity.name.function, support.function, meta.function-call.generic | #dcdcdc | — |
| variable, meta.variable, variable.other.object.property, variable.other.readwrite.alias | #dcdcdc | — |
| variable.other.object | #dcdcdc | — |
| variable.other.global, variable.language.this | #808080 | — |
| variable.other.local | #dcdcdc | — |
| variable.parameter, meta.parameter | #dcdcdc | — |
| variable.other.property, meta.property | #808080 | — |
| string, string.other.link, markup.inline.raw.string.markdown | #dcdcdc | — |
| constant.character.escape, constant.other.placeholder | #808080 | — |
| keyword | #808080 | — |
| keyword.control.import, keyword.control.from, keyword.import | #808080 | — |
| storage.modifier, keyword.modifier, storage.type | #808080 | — |
| comment, punctuation.definition.comment | #403c36 | — |
| comment.documentation, comment.line.documentation | #403c36 | — |
| constant.numeric | #dcdcdc | — |
| constant.language.boolean, constant.language.json | #dcdcdc | — |
| keyword.operator | #dcdcdc | — |
| entity.name.function.preprocessor, meta.preprocessor | #dcdcdc | — |
| meta.preprocessor | #dcdcdc | — |
| markup.underline.link | #808080 | — |
| entity.name.tag | #808080 | — |
| support.class.component | #dcdcdc | — |
| entity.other.attribute-name, meta.attribute | #808080 | — |
| support.type | #808080 | — |
| variable.other.constant, variable.readonly | #dcdcdc | — |
| entity.name.label, punctuation.definition.label | #dcdcdc | — |
| entity.name.namespace, storage.modifier.namespace, markup.bold.markdown | #dcdcdc | — |
| entity.name.module, storage.modifier.module | #808080 | — |
| variable.type.parameter, variable.parameter.type | #808080 | — |
| keyword.control.exception, keyword.control.trycatch | #808080 | — |
| meta.decorator, punctuation.decorator, entity.name.function.decorator | #dcdcdc | — |
| variable.function | #808080 | — |
| punctuation, punctuation.terminator, punctuation.definition.tag, punctuation.separator, punctuation.definition.string, punctuation.section.block | #808080 | — |
| punctuation.definition.string | #dcdcdc | — |