Monochromator

Color themes

• 

  Monochromator Dark Emerald

• 

  Monochromator Dark Plain

• 

  Monochromator Dark Ruby

• 

  Monochromator Dark Sulfur

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.activeForeground#d0d0d2
• activityBar.background#202024
• activityBar.foreground#e7e7e7
• activityBar.inactiveForeground#d0d0d2
• activityBarBadge.background#d0d0d2
• activityBarBadge.foreground#08080a
• badge.background#00000000
• badge.foreground#e7e7e7
• breadcrumb.foreground#808086
• button.background#505058
• button.foreground#e7e7e7
• button.secondaryBackground#50505880
• checkbox.background#08080a
• commandCenter.activeBackground#08080a
• commandCenter.activeBorder#50505880
• commandCenter.activeForeground#e7e7e7
• commandCenter.background#08080a
• commandCenter.border#50505880
• commandCenter.foreground#d0d0d2
• diffEditor.insertedLineBackground#30df8126
• diffEditor.insertedTextBackground#30df814d
• diffEditor.removedLineBackground#fe303a26
• diffEditor.removedTextBackground#fe303a4d
• dropdown.background#08080a
• dropdown.border#505058
• editor.background#08080a
• editor.findMatchBackground#393941
• editor.findMatchHighlightBackground#393941bf
• editor.foldBackground#20202480
• editor.foreground#e7e7e7
• editor.hoverHighlightBackground#39394180
• editor.lineHighlightBackground#202024
• editor.selectionBackground#393941
• editor.selectionHighlightBackground#393941
• editor.wordHighlightBackground#39394180
• editor.wordHighlightStrongBackground#02a9ff40
• editor.wordHighlightTextBackground#39394180
• editorBracketHighlight.foreground1#e7e7e7
• editorBracketHighlight.foreground2#e7e7e7
• editorBracketHighlight.foreground3#e7e7e7
• editorBracketHighlight.foreground4#e7e7e7
• editorBracketHighlight.foreground5#e7e7e7
• editorBracketHighlight.foreground6#e7e7e7
• editorBracketHighlight.unexpectedBracket.foreground#e7e7e7
• editorBracketMatch.background#08080a
• editorBracketMatch.border#e7e7e7
• editorCodeLens.foreground#808086
• editorCursor.foreground#e7e7e7
• editorError.foreground#fe303a
• editorGroup.border#202024
• editorGroupHeader.tabsBackground#202024
• editorGutter.addedBackground#30df81
• editorGutter.addedSecondaryBackground#30df8180
• editorGutter.deletedBackground#fe303a
• editorGutter.deletedSecondaryBackground#fe303a80
• editorGutter.modifiedBackground#ffae49
• editorGutter.modifiedSecondaryBackground#ffae4980
• editorHoverWidget.border#505058
• editorHoverWidget.foreground#e7e7e7
• editorIndentGuide.activeBackground#808086
• editorIndentGuide.background#80808650
• editorInfo.foreground#02a9ff
• editorInlayHint.background#202024
• editorInlayHint.foreground#808086
• editorLightBulb.foreground#808086
• editorLightBulbAi.foreground#808086
• editorLightBulbAutoFix.foreground#808086
• editorLineNumber.activeForeground#e7e7e7
• editorLineNumber.foreground#808086
• editorLink.activeForeground#e7e7e7
• editorOverviewRuler.border#00000000
• editorOverviewRuler.errorForeground#fe303a
• editorOverviewRuler.infoForeground#02a9ff
• editorOverviewRuler.warningForeground#ffae49
• editorStickyScrollHover.background#202024
• editorSuggestWidget.background#202024
• editorSuggestWidget.focusHighlightForeground#e7e7e7
• editorSuggestWidget.highlightForeground#e7e7e7
• editorSuggestWidget.selectionBackground#393941
• editorWarning.foreground#ffae49
• editorWidget.background#202024
• extensionButton.background#505058
• focusBorder#00000000
• gitDecoration.addedResourceForeground#30df81
• gitDecoration.deletedResourceForeground#fe303a
• gitDecoration.ignoredResourceForeground#808086
• gitDecoration.modifiedResourceForeground#ffae49
• gitDecoration.renamedResourceForeground#30df81
• gitDecoration.stageDeletedResourceForeground#fe303a
• gitDecoration.stageModifiedResourceForeground#ffae49
• gitDecoration.untrackedResourceForeground#30df81
• icon.foreground#d0d0d2
• input.background#08080a
• input.border#505058
• inputValidation.errorBackground#202024
• inputValidation.errorBorder#fe303a
• inputValidation.infoBackground#202024
• inputValidation.infoBorder#505058
• inputValidation.warningBackground#202024
• inputValidation.warningBorder#ffae49
• keybindingLabel.background#08080a
• keybindingLabel.border#808086
• keybindingLabel.bottomBorder#808086
• keybindingLabel.foreground#d0d0d2
• list.activeSelectionBackground#393941
• list.activeSelectionForeground#e7e7e7
• list.errorForeground#fe303a
• list.focusBackground#393941
• list.highlightForeground#e7e7e7
• list.hoverBackground#393941
• list.inactiveSelectionBackground#39394180
• list.warningForeground#ffae49
• menu.background#202024
• menu.border#505058
• menu.selectionBackground#393941
• menu.selectionForeground#d0d0d2
• menu.separatorBackground#393941
• minimap.errorHighlight#fe303a
• minimap.findMatchHighlight#393941
• minimap.infoHighlight#02a9ff
• minimap.selectionHighlight#393941
• minimap.selectionOccurrenceHighlight#393941
• minimap.warningHighlight#ffae49
• multiDiffEditor.border#505058
• multiDiffEditor.headerBackground#202024
• notifications.background#202024
• notifications.foreground#d0d0d2
• notificationsErrorIcon.foreground#d0d0d2
• notificationsInfoIcon.foreground#d0d0d2
• notificationsWarningIcon.foreground#d0d0d2
• panel.border#202024
• panelTitle.activeForeground#e7e7e7
• panelTitle.inactiveForeground#d0d0d2
• pickerGroup.border#505058
• pickerGroup.foreground#d0d0d2
• progressBar.background#d0d0d2
• quickInput.background#202024
• quickInput.foreground#d0d0d2
• quickInputList.focusBackground#393941
• quickInputList.focusForeground#e7e7e7
• scmGraph.historyItemHoverAdditionsForeground#30df81
• scmGraph.historyItemHoverDeletionsForeground#fe303a
• scmGraph.historyItemHoverLabelForeground#000000
• scmGraph.historyItemRefColor#d0d0d2
• scmGraph.historyItemRemoteRefColor#808086
• scrollbarSlider.activeBackground#50505890
• scrollbarSlider.background#50505843
• scrollbarSlider.hoverBackground#50505870
• selection.background#393941
• sideBar.background#202024
• sideBar.border#202024
• sideBar.foreground#d0d0d2
• sideBarSectionHeader.background#202024
• sideBarSectionHeader.border#202024
• statusBar.background#202024
• statusBar.border#00000000
• statusBar.debuggingBackground#202024
• statusBar.foreground#d0d0d2
• statusBar.noFolderBackground#202024
• statusBarItem.errorBackground#fe303a
• statusBarItem.hoverBackground#393941
• statusBarItem.prominentBackground#393941
• statusBarItem.remoteBackground#202024
• statusBarItem.remoteForeground#d0d0d2
• statusBarItem.warningBackground#ffae49
• tab.activeForeground#d0d0d2
• tab.border#00000000
• tab.hoverBackground#08080a
• tab.inactiveBackground#202024
• terminal.ansiBlack#08080a
• terminal.ansiBlue#02a9ff
• terminal.ansiBrightBlack#808086
• terminal.ansiBrightBlue#02a9ff
• terminal.ansiBrightCyan#00f3ff
• terminal.ansiBrightGreen#30df81
• terminal.ansiBrightMagenta#d559ff
• terminal.ansiBrightRed#fe303a
• terminal.ansiBrightWhite#e7e7e7
• terminal.ansiBrightYellow#fff556
• terminal.ansiCyan#00f3ff
• terminal.ansiGreen#30df81
• terminal.ansiMagenta#d559ff
• terminal.ansiRed#fe303a
• terminal.ansiWhite#808086
• terminal.ansiYellow#fff556
• terminal.background#08080a
• terminal.foreground#e7e7e7
• terminal.selectionBackground#e7e7e7
• terminal.selectionForeground#08080a
• terminalCommandDecoration.defaultBackground#808086
• terminalCommandDecoration.errorBackground#fe303a
• terminalCommandDecoration.successBackground#30df81
• textBlockQuote.background#202024
• textBlockQuote.border#505058
• textCodeBlock.background#202024
• textCodeBlock.border#505058
• textLink.activeForeground#02a9ff
• textLink.foreground#02a9ff
• textPreformat.background#393941
• textPreformat.foreground#e7e7e7
• textSeparator.foreground#393941
• titleBar.activeBackground#202024
• titleBar.activeForeground#d0d0d2
• titleBar.border#00000000
• titleBar.inactiveBackground#202024
• titleBar.inactiveForeground#808086
• tree.indentGuidesStroke#80808650
• welcomePage.progress.foreground#d0d0d2
• widget.border#00000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).