Deepdark Material Theme
Publisher: NimdaThemes in package: 2
A clean dark material theme and icon package for Visual Studio Code Editor
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#080808
- activityBar.foreground#f5f5f5
- activityBarBadge.background#F3C900
- activityBarBadge.foreground#080808
- breadcrumb.activeSelectionForeground#D0D0D0
- breadcrumb.focusForeground#8C8C8A
- breadcrumb.foreground#6D6D6D
- breadcrumbPicker.background#292928
- button.background#00A4F3
- button.foreground#FFFFFF
- button.hoverBackground#0093DA
- debugExceptionWidget.background#F3002B
- debugExceptionWidget.border#F3002B
- debugToolBar.background#3D3D3C
- diffEditor.insertedTextBackground#00A78A40
- diffEditor.removedTextBackground#A7001D40
- dropdown.border#50504F
- editor.background#080808
- editor.findMatchBackground#43a047
- editor.findMatchHighlightBackground#880e4f
- editor.findRangeHighlightBackground#50504F4D
- editor.foreground#F8F8F2
- editor.hoverHighlightBackground#333332
- editor.inactiveSelectionBackground#3D3D3C
- editor.lineHighlightBackground#212121
- editor.lineHighlightBorder#292928
- editor.rangeHighlightBackground#50504F4D
- editor.selectionBackground#50504F
- editor.selectionHighlightBackground#3D3D3C
- editor.wordHighlightBackground#333332
- editor.wordHighlightStrongBackground#DA0093
- editorBracketMatch.background#333332
- editorBracketMatch.border#50504F
- editorCodeLens.foreground#6D6D6D
- editorCursor.foreground#D0D0D0
- editorError.foreground#F3002B
- editorGroup.dropBackground#00000040
- editorGroupHeader.tabsBackground#080808
- editorGutter.addedBackground#00F3C9
- editorGutter.deletedBackground#F3002B
- editorGutter.modifiedBackground#F3C900
- editorHint.foreground#A9B9B0
- editorHoverWidget.background#333332
- editorHoverWidget.border#333332
- editorIndentGuide.activeBackground#50504F
- editorIndentGuide.background#333332
- editorInfo.foreground#00F3C9
- editorLineNumber.foreground#50504F
- editorLink.activeForeground#8C8C8A
- editorMarkerNavigation.background#1F1F1E
- editorMarkerNavigationError.background#F3002B
- editorMarkerNavigationWarning.background#F3C900
- editorOverviewRuler.addedForeground#00F3C9
- editorOverviewRuler.currentContentForeground#00F3C9
- editorOverviewRuler.deletedForeground#F3002B
- editorOverviewRuler.errorForeground#F3002B
- editorOverviewRuler.findMatchForeground#DA0093
- editorOverviewRuler.incomingContentForeground#00A4F3
- editorOverviewRuler.infoForeground#00F3C9
- editorOverviewRuler.modifiedForeground#F3C900
- editorOverviewRuler.rangeHighlightForeground#50504F
- editorOverviewRuler.selectionHighlightForeground#8C8C8A
- editorOverviewRuler.warningForeground#F3C900
- editorOverviewRuler.wordHighlightForeground#8C8C8A
- editorOverviewRuler.wordHighlightStrongForeground#DA0093
- editorRuler.foreground#333332
- editorSuggestWidget.border#292928
- editorSuggestWidget.foreground#D0D0D0
- editorSuggestWidget.highlightForeground#F8F8F2
- editorSuggestWidget.selectedBackground#3D3D3C
- editorWarning.foreground#F3C900
- editorWhitespace.foreground#333332
- editorWidget.background#292928
- editorWidget.border#3D3D3C
- errorForeground#F3002B
- extensionButton.prominentBackground#00A4F3
- extensionButton.prominentForeground#FFFFFF
- extensionButton.prominentHoverBackground#0093DA
- focusBorder#080808
- gitDecoration.conflictingResourceForeground#FF41C1
- gitDecoration.deletedResourceForeground#F3002B
- gitDecoration.ignoredResourceForeground#8C8C8A
- gitDecoration.modifiedResourceForeground#F3C900
- gitDecoration.untrackedResourceForeground#00F3C9
- input.border#50504F
- inputOption.activeBorder#B2B2B1
- list.activeSelectionBackground#212121
- list.activeSelectionForeground#F3C900
- list.dropBackground#333332
- list.errorForeground#F3002B
- list.focusBackground#212121
- list.highlightForeground#F8F8F2
- list.hoverBackground#212121
- list.inactiveSelectionBackground#212121
- list.inactiveSelectionForeground#F3C900
- list.warningForeground#F3C900
- menu.background#0c0c0c
- menu.foreground#8C8C8A
- menu.selectionBackground#212121
- menu.selectionForeground#F3C900
- menubar.selectionBackground#212121
- menubar.selectionForeground#F3C900
- merge.currentContentBackground#0074604D
- merge.currentHeaderBackground#007460
- merge.incomingContentBackground#0070A74D
- merge.incomingHeaderBackground#0070A7
- notification.background#3D3D3C
- notification.buttonBackground#00A4F3
- notification.buttonForeground#FFFFFF
- notification.buttonHoverBackground#0093DA
- notification.errorBackground#F3002B
- notification.errorForeground#42000C
- notification.foreground#F8F8F2
- notification.infoBackground#00F3C9
- notification.infoForeground#007460
- notification.warningBackground#F3C900
- notification.warningForeground#746000
- notificationCenterHeader.background#3D3D3C
- notificationCenterHeader.foreground#B2B2B1
- notificationLink.foreground#00A4F3
- notifications.background#292928
- notifications.border#3D3D3C
- notifications.foreground#F8F8F2
- panel.background#080808
- panel.border#3D3D3C
- panelTitle.activeBorder#00A4F3
- panelTitle.activeForeground#FFFFFF
- panelTitle.inactiveForeground#8C8C8A
- peekView.border#00A4F3
- peekViewEditor.background#0B0B0B
- peekViewEditor.matchHighlightBackground#DA0093
- peekViewResult.background#292928
- peekViewResult.fileForeground#F8F8F2
- peekViewResult.lineForeground#D0D0D0
- peekViewResult.matchHighlightBackground#8E005F
- peekViewResult.selectionBackground#0B0B0B
- peekViewResult.selectionForeground#F8F8F2
- peekViewTitle.background#00A4F3
- peekViewTitleDescription.foreground#FFFFFF
- peekViewTitleLabel.foreground#FFFFFF
- pickerGroup.border#F3C900
- pickerGroup.foreground#F3C900
- sideBar.background#0c0c0c
- sideBar.foreground#8C8C8A
- sideBarSectionHeader.background#212121
- sideBarSectionHeader.foreground#B2B2B1
- statusBar.background#080808
- statusBar.debuggingBackground#F34F00
- statusBar.debuggingForeground#F8F8F2
- statusBar.foreground#878787
- statusBar.noFolderBackground#080808
- statusBar.noFolderForeground#878787
- statusBarItem.activeBackground#000000
- statusBarItem.hoverBackground#0B0B0B
- tab.activeBackground#000000
- tab.activeBorder#080808
- tab.activeBorderTop#fffb00
- tab.border#080808
- tab.hoverBackground#080808
- tab.inactiveBackground#212121
- tab.inactiveForeground#B2B2B1
- tab.unfocusedActiveBorder#080808
- tab.unfocusedActiveBorderTop#080808
- tab.unfocusedActiveForeground#D0D0D0
- tab.unfocusedInactiveForeground#8C8C8A
- terminal.background#080808
- titleBar.activeBackground#080808
- titleBar.activeForeground#878787
- titleBar.inactiveBackground#080808
- titleBar.inactiveForeground#878787
- walkThrough.embeddedEditorBackground#0B0B0B
- welcomePage.buttonBackground#292928
- welcomePage.buttonHoverBackground#0B0B0B
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment | #808080 | — |
| source.js constant | #d6498b | — |
| meta | #fff | — |
| string.quoted | #69f0ae | — |
| string | #f7c376 | — |
| constant.numeric | #D0D0D0 | — |
| constant.language | #ff3e3e | — |
| keyword.operator | #FF5E5E | — |
| punctuation.definition.binding-pattern, meta.import punctuation.definition.block | #FF5E5E | — |
| keyword.control | #9575cd | — |
| storage.type | #fffb2a | — |
| storage.modifier | #69f0ae | — |
| variable.language | #ff9431 | — |
| constant.character, constant.other | #8080FF | |
| storage.other | #9872A2 | |
| entity.name.class, entity.name.type | #FF5E5E | |
| punctuation.separator.variable | #6089B4 | |
| support.function | #ffc107 | — |
| meta.tag punctuation.definition.string | #D0B344 | |
| punctuation.section.embedded -(source string source punctuation.section.embedded), meta.brace.erb.html | #D0B344 | |
| meta.tag string -source -punctuation, text source text meta.tag string -punctuation | #6089B4 | |
| meta.tag.other, entity.name.tag.style, entity.name.tag.script, meta.tag.block.script, source.js.embedded punctuation.definition.tag.html, source.css.embedded punctuation.definition.tag.html | #cecece | |
| meta.tag.inline source, text.html.php.source | #9AA83A | |
| meta.doctype, meta.tag.sgml-declaration.doctype, meta.tag.sgml.doctype | #9AA83A | |
| meta.tag.other | #D0B344 | |
| variable.other.property | #8d6e63 | |
| meta.function-call.object | #9872A2 | |
| variable.other.normal | #6089B4 | |
| meta.brace.erb.html | #D08442 | |
| meta.object-literal.key | #eeeeee | — |
| meta.toc-list.id | #9AA83A | — |
| punctuation.section.embedded.coffee | #D08442 | — |
| meta.property-group support.constant.property-value.css, meta.property-value support.constant.property-value.css | #C7444A | |
| variable.language.ruby | #D0B344 | |
| markup.deleted | #dc322f | |
| markup.changed | #cb4b16 | |
| markup.inserted | #219186 | — |
| markup.quote | #9872A2 | — |
| markup.list | #9AA83A | — |
| markup.bold, markup.italic | #6089B4 | — |
| markup.inline.raw | #FF0080 | |
| token.info-token | #6796e6 | — |
| token.warn-token | #cd9731 | — |
| token.error-token | #f44747 | — |
| token.debug-token | #b267e6 | — |
| markup.heading | #D0B344 | — |
| markup.heading.setext | #D0B344 | |
| meta.diff, meta.diff.header | #E0EDDD | — |
| punctuation.section.embedded.begin.ruby, punctuation.section.embedded.end.ruby | #D08442 | — |
| keyword.other.special-method.ruby | #D9B700 | |
| punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php | #D08442 | |
| constant.other.symbol.ruby | #9AA83A | |
| source.php.embedded.line.html | #676867 | — |
| punctuation.definition.string.end.php, punctuation.definition.string.begin.php | #9AA83A | — |
| meta.function-call.object.php | #D0B344 | |
| variable.language.js | #CC555A | — |
| support.type.property-name.css | #ffd27d | |
| meta.selector.css entity.other.attribute-name.id | #a27272 | |
| punctuation.definition.tag.html, punctuation.definition.tag.begin, punctuation.definition.tag.end | #fff461 | |
| invalid | #FF0B00 | |
| string.quoted.double.html, punctuation.definition.string.begin.html, punctuation.definition.string.end.html | #e09be2 | |
| punctuation.separator, punctuation.terminator | #D0D0D0 | — |
| string.regexp, string.regexp keyword.control, string.regexp keyword.operator | #69f0ae | — |
| string.regexp punctuation.definition.string | #A9B9B0 | — |
| string.regexp keyword.other | #FF5E5E | — |
| entity.name.function | #80cbc4 | — |
| punctuation.definition.parameters, punctuation.definition.arguments | #C9E9E0 | — |
| meta.parameters | — | — |
| variable.parameter | #FF5E5E | — |
| variable.function, meta.function-call entity.name.function, meta.method-call entity.name.function | #d68d5b | — |
| entity.name.type.class, entity.other.inherited-class, support.class | #B8FCB1 | — |
| keyword.control.conditional, keyword.control.import | #FFD14A | — |
| meta.tag.sgml, meta.tag.sgml variable.language, meta.tag.sgml punctuation.definition.tag | #FFCC32 | — |
| meta.tag.preprocessor, meta.tag.preprocessor entity.name.tag, meta.tag.preprocessor punctuation.definition.tag | #FFCC32 | — |
| entity.name.tag | #FF5E5E | — |
| punctuation.definition.tag | #D0D0D0 | — |
| entity.other.attribute-name | #8CDAFF | — |
| meta.tag.metadata.script entity.name.tag, meta.tag.metadata.script punctuation.definition.tag | #B8FCB1 | — |
| support.type.property-name | #F8F8F2 | — |
| meta.property-value | #69f0ae | — |
| punctuation.section | #D0D0D0 | — |
| variable.css, variable.scss | #FFE082 | — |
| punctuation.definition.entity, punctuation.definition.attribute-selector | #8CDAFF | — |
| Attribute Selector String Value | #69f0ae | — |
| keyword.control.at-rule, keyword.control.at-rule punctuation | #69f0ae | — |
| meta.at-rule support.function | #8CDAFF | — |
| meta.at-rule.mixin variable.scss, meta.at-rule.function variable.scss | #D0D0D0 | — |
| meta.at-rule.mixin support.constant, meta.at-rule.mixin variable.parameter, meta.at-rule.function support.constant, meta.at-rule.function variable.parameter | #69f0ae | — |
| meta.at-rule.mixin constant.numeric, meta.at-rule.function constant.numeric | — | — |
| keyword.control.at-rule.include, keyword.control.at-rule.include punctuation | #FF5E5E | normal |
| meta.at-rule.function punctuation.section | #C9E9E0 | — |
| meta.at-rule.return | #D0D0D0 | — |
| meta.at-rule.return punctuation.definition.begin.bracket, meta.at-rule.return punctuation.definition.end.bracket | #D0D0D0 | — |
| meta.at-rule.include entity.name.function, meta.at-rule.include punctuation, meta.property-value punctuation.section.function | #C9E9E0 | — |
| punctuation.definition.interpolation | #D77676 | — |
| punctuation.definition.map | #D77676 | — |
| comment storage.type, comment punctuation.definition.block | #6D6D6D | normal |
| punctuation.definition.block, punctuation.definition.dictionary | #A9B9B0 | — |
| meta.brace.square, punctuation.definition.array | #D77676 | — |
| meta.brace.round | #C9E9E0 | — |
| meta.embedded, source.groovy.embedded | #C5C8C6 | — |
| string source | #D08442 | |
| punctuation.accessor | #FF5E5E | — |
| support.variable.dom, support.class.console, support.type.object | #ec407a | — |
| support.variable.property.js | #E9FDAC | — |
| support.class.js, support.class.builtin.js | #8CDAFF | — |
| meta.function-call support.class.builtin.js, new.expr entity.name.type.js | #C9E9E0 | — |
| support.class.js | #F8F8F2 | — |
| string.template.js, punctuation.definition.string.template | #69f0ae | — |
| meta.template.expression | #F8F8F2 | — |
| punctuation.definition.template-expression | #D77676 | — |
| punctuation.support.type.property-name | #B2B2B1 | — |
| punctuation.section.embedded | #A9B9B0 | — |
| punctuation.definition.begin.bracket.round, punctuation.definition.end.bracket.round | #C9E9E0 | — |
| variable.other.php | #F8F8F2 | — |
| meta.function.parameter | #D0D0D0 | — |
| punctuation.section.array | #D77676 | — |
| keyword.other.new | #FF5E5E | — |
| keyword.other.sql, keyword.other.DML.sql, keyword.other.alias.sql | #FF5E5E | — |
| keyword.other.DDL.create.II.sql | #D77676 | — |
| entity.name.section, punctuation.definition.heading | #FFE082 | — |
| markup beginning.punctuation | #FF5E5E | — |
| markup punctuation | #B2B2B1 | — |
| string.other.link | #C9E9E0 | — |
| markup.underline.link | #6D6D6D | — |
| string.other.link.description.title | #D0D0D0 | — |
| meta.link punctuation | #B2B2B1 | — |
| meta.image punctuation | #B2B2B1 | — |
| markup.fenced_code punctuation | #B8FCB1 | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...