Depth of Midnight
Publisher: Syntax SparkThemes in package: 1
The dark theme for midnight coding
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.activeBorder#FFC837
- activityBar.background#0E0E18
- activityBar.foreground#FFC837
- activityBarBadge.background#FFB700
- activityBarBadge.foreground#0E0E18
- badge.background#FFB700
- badge.foreground#0E0E18
- breadcrumb.activeSelectionForeground#E0E0E0
- breadcrumb.background#0E0E18
- breadcrumb.focusForeground#FFC837
- breadcrumb.foreground#B2CCD6
- breadcrumbPicker.background#12121D
- button.background#FFC837
- button.foreground#0E0E18
- button.hoverBackground#FFB700
- button.secondaryHoverBackground#4B4B55A0
- debugToolBar.background#0E0E18
- diffEditor.diagonalFill#12121D
- diffEditor.insertedTextBackground#7FD9621F
- diffEditor.removedTextBackground#F26D781F
- dropdown.background#12121D
- dropdown.border#202029
- dropdown.foreground#C0C0C0
- editor.background#0E0E18
- editor.findMatchBackground#E0E0E050
- editor.findMatchHighlightBackground#4B4B55A0
- editor.findRangeHighlightBackground#4B4B55A0
- editor.foreground#E0E0E0
- editor.hoverHighlightBackground#202029
- editor.inactiveSelectionBackground#2A2A2D
- editor.lineHighlightBackground#18181D
- editor.lineHighlightBorder#202029
- editor.rangeHighlightBackground#202029
- editor.selectionBackground#4B4B55
- editor.selectionHighlightBackground#4B4B55A0
- editor.selectionHighlightBorder#E0E0E050
- editor.snippetTabstopHighlightBackground#7fd96233
- editor.wordHighlightBackground#4B4B5550
- editor.wordHighlightBorder#4B4B55
- editor.wordHighlightStrongBackground#4B4B5550
- editor.wordHighlightStrongBorder#C0C0C0C0
- editorBracketMatch.background#2A2A2D
- editorBracketMatch.border#4B4B55
- editorCursor.foreground#FFC837
- editorError.foreground#FF4500
- editorGhostText.background#0E0E18
- editorGhostText.border#202029
- editorGroup.border#202029
- editorGroupHeader.border#0E0E18
- editorGroupHeader.noTabsBackground#0E0E18
- editorGroupHeader.tabsBackground#0E0E18
- editorGroupHeader.tabsBorder#0E0E18
- editorGutter.addedBackground#00FF7F
- editorGutter.deletedBackground#FF4500
- editorGutter.modifiedBackground#FFD700
- editorHoverWidget.background#12121D
- editorHoverWidget.border#202029
- editorIndentGuide.activeBackground1#4B4B55
- editorIndentGuide.background1#2A2A2D
- editorInfo.foreground#FFC837
- editorLineNumber.activeForeground#FFC837
- editorLineNumber.foreground#C0C0C0
- editorLink.activeForeground#1E90FF
- editorOverviewRuler.addedForeground#00FF7F
- editorOverviewRuler.border#202029
- editorOverviewRuler.bracketMatchForeground#4B4B55
- editorOverviewRuler.deletedForeground#FF4500
- editorOverviewRuler.errorForeground#FF4500
- editorOverviewRuler.infoForeground#FFC837
- editorOverviewRuler.modifiedForeground#FFD700
- editorOverviewRuler.warningForeground#FFB700
- editorRuler.foreground#2A2A2D
- editorStickyScroll.background#0E0E18
- editorStickyScrollHover.background#202029
- editorSuggestWidget.background#12121D
- editorSuggestWidget.border#202029
- editorSuggestWidget.foreground#C0C0C0
- editorSuggestWidget.selectedBackground#18181D
- editorWarning.foreground#FFB700
- editorWhitespace.foreground#4B4B55
- editorWidget.background#12121D
- editorWidget.border#202029
- focusBorder#FFC837C0
- input.background#12121D
- input.border#202029
- input.foreground#E0E0E0
- input.placeholderForeground#C0C0C0
- inputOption.activeBackground#FFC83750
- inputOption.activeBorder#FFA600C0
- inputOption.activeForeground#FFC837
- list.activeSelectionBackground#4B4B55A0
- list.activeSelectionForeground#E0E0E0
- list.focusBackground#18181D
- list.focusForeground#E0E0E0
- list.highlightForeground#FFC837
- list.hoverBackground#4B4B5550
- list.inactiveSelectionBackground#4B4B55A0
- list.inactiveSelectionForeground#C0C0C0
- menu.background#0E0E18
- menu.foreground#E0E0E0
- menu.selectionBackground#18181D
- menu.selectionForeground#FFC837
- menu.separatorBackground#4B4B55A0
- menubar.selectionBackground#18181D
- menubar.selectionForeground#FFC837
- merge.border#202029
- merge.commonContentBackground#12121D
- merge.commonHeaderBackground#202029
- merge.currentContentBackground#12121D
- merge.currentHeaderBackground#202029
- merge.incomingContentBackground#12121D
- merge.incomingHeaderBackground#202029
- mergeEditor.change.background#18181D
- mergeEditor.change.word.background#2A2A2D
- mergeEditor.conflict.unhandledFocused.border#FFC837
- minimap.background#0E0E18
- minimap.errorHighlight#FF4500
- minimap.findMatchHighlight#2A2A2D
- minimap.selectionHighlight#4B4B55A0
- minimap.warningHighlight#FFB700
- minimapGutter.addedBackground#00FF7F
- minimapGutter.deletedBackground#FF4500
- minimapGutter.modifiedBackground#FFD700
- minimapSlider.activeBackground#E0E0E050
- minimapSlider.background#C0C0C050
- minimapSlider.hoverBackground#E0E0E050
- notebook.cellBorderColor#202029
- notebook.cellHoverBackground#12121D
- notebook.cellInsertionIndicator#FFC837
- notebook.cellStatusBarItemHoverBackground#202029
- notebook.cellToolbarSeparator#202029
- notebook.focusedCellBorder#FFC837
- notebook.focusedEditorBorder#FFC837
- notebook.outputContainerBackgroundColor#0E0E18
- notebook.outputContainerBorderColor#202029
- notebook.symbolHighlightBackground#18181D
- notebookScrollbarSlider.activeBackground#E0E0E050
- notebookScrollbarSlider.background#C0C0C050
- notebookScrollbarSlider.hoverBackground#E0E0E050
- notebookStatusErrorIcon.foreground#FF4500
- notebookStatusRunningIcon.foreground#1E90FF
- notebookStatusSuccessIcon.foreground#00FF7F
- notificationCenterHeader.background#12121D
- notificationCenterHeader.foreground#C0C0C0
- notifications.background#12121D
- notifications.foreground#C0C0C0
- notificationsErrorIcon.foreground#FF4500
- notificationsInfoIcon.foreground#FFC837
- notificationsWarningIcon.foreground#FFB700
- panel.background#0E0E18
- panel.border#202029
- panelInput.border#202029
- panelTitle.activeBorder#FFC837
- panelTitle.activeForeground#FFC837
- panelTitle.inactiveForeground#C0C0C0
- peekView.border#FFC837
- peekViewEditor.background#0E0E18
- peekViewEditor.matchHighlightBackground#18181D
- peekViewEditorGutter.background#0E0E18
- peekViewResult.background#12121D
- peekViewResult.lineForeground#C0C0C0
- peekViewResult.matchHighlightBackground#18181D
- peekViewTitle.background#0E0E18
- peekViewTitleDescription.foreground#C0C0C0
- peekViewTitleLabel.foreground#FFC837
- pickerGroup.border#202029
- pickerGroup.foreground#FFC837
- ports.iconRunningProcessForeground#00FF7F
- problemsErrorIcon.foreground#FF4500
- problemsInfoIcon.foreground#FFC837
- problemsWarningIcon.foreground#FFB700
- progressBar.background#FFC837
- quickInput.background#12121D
- quickInput.foreground#C0C0C0
- quickInputTitle.background#0E0E18
- scrollbar.shadow#C0C0C050
- scrollbarSlider.activeBackground#E0E0E050
- scrollbarSlider.background#C0C0C050
- scrollbarSlider.hoverBackground#E0E0E050
- settings.checkboxBackground#12121D
- settings.checkboxBorder#202029
- settings.checkboxForeground#C0C0C0
- settings.dropdownBackground#12121D
- settings.dropdownBorder#202029
- settings.dropdownForeground#C0C0C0
- settings.dropdownListBorder#202029
- settings.focusedRowBackground#18181D
- settings.focusedRowBorder#FFC837
- settings.headerForeground#FFC837
- settings.modifiedItemIndicator#FFC837
- settings.numberInputBackground#12121D
- settings.numberInputBorder#202029
- settings.numberInputForeground#C0C0C0
- settings.textInputBackground#12121D
- settings.textInputBorder#202029
- settings.textInputForeground#C0C0C0
- sideBar.background#12121D
- sideBar.border#202029
- sideBar.dropBackground#18181D
- sideBar.foreground#C0C0C0
- sideBarSectionHeader.background#0E0E18
- sideBarSectionHeader.border#202029
- sideBarSectionHeader.foreground#CCA300
- sideBarTitle.foreground#C0C0C0
- statusBar.background#0E0E18
- statusBar.debuggingBackground#0E0E18
- statusBar.debuggingBorder#CCA300
- statusBar.foreground#E5B800
- statusBar.noFolderBackground#0E0E18
- statusBar.noFolderBorder#202029
- statusBarItem.activeBackground#202029
- statusBarItem.compactHoverBackground#12121D
- statusBarItem.hoverBackground#12121D
- statusBarItem.prominentBackground#202029
- statusBarItem.prominentHoverBackground#12121D
- symbolIcon.arrayForeground#D7F76C
- symbolIcon.booleanForeground#D26CF7
- symbolIcon.classForeground#F78C6C
- symbolIcon.colorForeground#ffffff
- symbolIcon.constantForeground#D26CF7
- symbolIcon.constructorForeground#82AAFF
- symbolIcon.enumeratorForeground#FF4500
- symbolIcon.enumeratorMemberForeground#FF6682
- symbolIcon.eventForeground#D7F76C
- symbolIcon.fieldForeground#C0C0C0
- symbolIcon.fileForeground#C0C0C0
- symbolIcon.folderForeground#C0C0C0
- symbolIcon.functionForeground#FFCF7A
- symbolIcon.interfaceForeground#6CD7F7
- symbolIcon.keyForeground#D26CF7
- symbolIcon.keywordForeground#6CD7F7
- symbolIcon.methodForeground#82AAFF
- symbolIcon.moduleForeground#FF6682
- symbolIcon.namespaceForeground#FFCF7A
- symbolIcon.nullForeground#FF4500
- symbolIcon.numberForeground#D26CF7
- symbolIcon.objectForeground#C0C0C0
- symbolIcon.operatorForeground#6CD7F7
- symbolIcon.packageForeground#FFC837
- symbolIcon.propertyForeground#B2CCD6
- symbolIcon.referenceForeground#6CD7F7
- symbolIcon.snippetForeground#FFC837
- symbolIcon.stringForeground#D7F76C
- symbolIcon.structForeground#F78C6C
- symbolIcon.textForeground#C0C0C0
- symbolIcon.typeParameterForeground#F78C6C
- symbolIcon.unitForeground#D26CF7
- symbolIcon.variableForeground#C0C0C0
- tab.activeBackground#12121D
- tab.activeBorderTop#FFC837
- tab.activeForeground#FFC837
- tab.border#202029
- tab.inactiveBackground#0E0E18
- tab.inactiveForeground#C0C0C0
- terminal.ansiBlack#202029
- terminal.ansiBlue#1E90FF
- terminal.ansiBrightBlack#708090
- terminal.ansiBrightBlue#1E90FF
- terminal.ansiBrightCyan#00CED1
- terminal.ansiBrightGreen#00FF7F
- terminal.ansiBrightMagenta#FF69B4
- terminal.ansiBrightRed#FF4500
- terminal.ansiBrightWhite#E0E0E0
- terminal.ansiBrightYellow#FFD700
- terminal.ansiCyan#00CED1
- terminal.ansiGreen#00FF7F
- terminal.ansiMagenta#FF69B4
- terminal.ansiRed#FF4500
- terminal.ansiWhite#C0C0C0
- terminal.ansiYellow#FFD700
- terminal.background#0E0E18
- terminal.foreground#C0C0C0
- terminal.selectionBackground#4B4B55A0
- textBlockQuote.background#0E0E18
- textBlockQuote.border#202029
- textCodeBlock.background#0E0E18
- textLink.activeForeground#1E90FF
- textLink.foreground#1E90FF
- textPreformat.foreground#C0C0C0
- textSeparator.foreground#4B4B55
- titleBar.activeBackground#0E0E18
- titleBar.activeForeground#FFC837
- titleBar.inactiveBackground#12121D
- titleBar.inactiveForeground#C0C0C0
- toolbar.activeBackground#18181D
- toolbar.hoverBackground#202029
- tree.indentGuidesStroke#202029
- tree.tableColumnsBorder#202029
- tree.tableOddRowsBackground#0E0E18
- walkThrough.embeddedEditorBackground#0E0E18
- welcomePage.background#0E0E18
- welcomePage.progress.background#202029
- welcomePage.progress.foreground#FFC837
- welcomePage.tileBackground#0E0E18
- welcomePage.tileHoverBackground#12121D
- widget.shadow#202029
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #546E7A | italic |
| string constant.other.placeholder, variable | #C0C0C0 | — |
| constant.other.color | #ffffff | — |
| invalid, invalid.illegal | #FF6682 | — |
| storage.modifier | #6CD7F7 | — |
| keyword.control.flow, keyword.operator.new, keyword.type, storage.modifier.async, storage.type | #FF6682 | — |
| keyword.operator, keyword.control, keyword.other, keyword.other.template, keyword.other.substitution, meta.tag | #6CD7F7 | — |
| punctuation, punctuation.definition.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.separator.inheritance.php, punctuation.section.embedded | #6CD7F7 | — |
| punctuation.definition.string, punctuation.definition.string.html, punctuation.definition.string.begin.html, punctuation.definition.string.end.html | #D7F76C | — |
| entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter | #F78C6C | — |
| entity.name.function, meta.function-call.generic, variable.function, support.function, keyword.other.special-method | #FFCF7A | — |
| meta.block variable.other | #C0C0C0 | — |
| support.other.variable, string.other.link | #C0C0C0 | — |
| constant.numeric, constant.language, support.constant, constant.character, constant.escape, keyword.other.unit | #D26CF7 | — |
| string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js | #D7F76C | — |
| constant.other.database-name, constant.other.table-name | #FFCF7A | — |
| keyword.other.DML, keyword.other.DDL, keyword.other.DCL, keyword.other.order | #F78C6C | — |
| keyword.other.alias, keyword.other.create | #FF6682 | — |
| support.class, support.type, entity.name.type | #F78C6C | — |
| support.type.sys-types, support.other.namespace.use.php, support.other.namespace.php, meta.use.php, markup.changed.git_gutter | #FFCF7A | — |
| source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name | #B2CCD6 | — |
| entity.name.module.js, variable.import.parameter.js, variable.other.class.js | #FF6682 | — |
| variable.language | #F78C6C | italic |
| entity.name.method.js | #82AAFF | italic |
| meta.class-method.js entity.name.function.js, variable.function.constructor | #82AAFF | — |
| entity.other.attribute-name | #6CD7F7 | — |
| text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name | #FFCF7A | italic |
| entity.other.attribute-name.class | #6CD7F7 | — |
| source.sass keyword.control | #82AAFF | — |
| markup.inserted | #C3E88D | — |
| markup.deleted | #FF6682 | — |
| markup.changed | #D26CF7 | — |
| string.regexp | #6CD7F7 | — |
| constant.character.escape | #D26CF7 | — |
| *url*, *link*, *uri* | — | underline |
| tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js | #82AAFF | italic |
| source.js constant.other.object.key.js string.unquoted.label.js | #FF6682 | italic |
| source.json meta.structure.dictionary.json support.type.property-name.json | #89DDFF | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #80D1FF | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #78CDFF | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #6CD7F7 | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #5AD4E8 | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #49B5D9 | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #38A4CA | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #27A3BB | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #1692AC | — |