Theme Charcoal Mint Co.
Publisher: charcoal-mint-studioThemes in package: 2
A refreshing dark theme with charcoal background and mint accents that reduces eye strain and brings natural freshness to your coding experience
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.activeBackground#85e88515
- activityBar.activeBorder#85e885
- activityBar.background#1e201e
- activityBar.foreground#e8ede8
- activityBar.inactiveForeground#8a908a
- activityBarBadge.background#85e885
- activityBarBadge.foreground#1e201e
- badge.background#85e885
- badge.foreground#1e201e
- breadcrumb.activeSelectionForeground#85e885
- breadcrumb.background#2a2d2a
- breadcrumb.focusForeground#e8ede8
- breadcrumb.foreground#8a908a
- breadcrumbPicker.background#1e201e
- button.background#85e885
- button.foreground#1e201e
- button.hoverBackground#75e875
- button.secondaryBackground#424542
- button.secondaryForeground#e8ede8
- button.secondaryHoverBackground#5a5d5a
- diffEditor.insertedTextBackground#85e88515
- diffEditor.removedTextBackground#e8555515
- dropdown.background#242624
- dropdown.border#424542
- dropdown.foreground#e8ede8
- editor.background#2a2d2a
- editor.findMatchBackground#e8c54750
- editor.findMatchHighlightBackground#e8c54725
- editor.findRangeHighlightBackground#85e88515
- editor.foldBackground#85e88508
- editor.foreground#e8ede8
- editor.hoverHighlightBackground#85e88515
- editor.lineHighlightBackground#424542
- editor.lineHighlightBorder#85e88515
- editor.rangeHighlightBackground#85e88515
- editor.selectionBackground#85e88525
- editor.selectionHighlightBackground#85e88515
- editor.wordHighlightBackground#8dd4a825
- editor.wordHighlightStrongBackground#8dd4a835
- editorBracketHighlight.foreground1#85e885
- editorBracketHighlight.foreground2#8dd4a8
- editorBracketHighlight.foreground3#75e875
- editorBracketHighlight.foreground4#47b366
- editorBracketHighlight.foreground5#339955
- editorBracketHighlight.foreground6#2a7a4a
- editorBracketHighlight.unexpectedBracket.foreground#e85555
- editorCursor.foreground#85e885
- editorError.foreground#e85555
- editorGroup.border#424542
- editorGroup.dropBackground#85e88515
- editorGroupHeader.tabsBackground#1e201e
- editorGutter.addedBackground#85e885
- editorGutter.deletedBackground#e85555
- editorGutter.modifiedBackground#66b3e8
- editorHoverWidget.background#1e201e
- editorHoverWidget.border#424542
- editorInfo.foreground#66b3e8
- editorLineNumber.activeForeground#b8c8b8
- editorLineNumber.foreground#8a908a
- editorLink.activeForeground#8dd4a8
- editorOverviewRuler.addedForeground#85e885
- editorOverviewRuler.border#424542
- editorOverviewRuler.deletedForeground#e85555
- editorOverviewRuler.errorForeground#e85555
- editorOverviewRuler.infoForeground#66b3e8
- editorOverviewRuler.modifiedForeground#66b3e8
- editorOverviewRuler.selectionHighlightForeground#85e885
- editorOverviewRuler.warningForeground#e8c547
- editorOverviewRuler.wordHighlightForeground#8dd4a8
- editorOverviewRuler.wordHighlightStrongForeground#75e875
- editorSuggestWidget.background#1e201e
- editorSuggestWidget.foreground#e8ede8
- editorSuggestWidget.selectedBackground#85e88525
- editorWarning.foreground#e8c547
- editorWidget.background#1e201e
- editorWidget.border#424542
- errorForeground#e85555
- focusBorder#85e885
- foreground#e8ede8
- gitDecoration.conflictingResourceForeground#e8c547
- gitDecoration.deletedResourceForeground#e85555
- gitDecoration.ignoredResourceForeground#8a908a
- gitDecoration.modifiedResourceForeground#66b3e8
- gitDecoration.untrackedResourceForeground#85e885
- input.background#242624
- input.border#424542
- input.foreground#e8ede8
- input.placeholderForeground#8a908a
- inputOption.activeBorder#85e885
- inputValidation.errorBorder#e85555
- inputValidation.infoBorder#66b3e8
- inputValidation.warningBorder#e8c547
- list.activeSelectionBackground#85e88525
- list.activeSelectionForeground#e8ede8
- list.dropBackground#85e88515
- list.errorForeground#e85555
- list.focusBackground#85e88515
- list.highlightForeground#85e885
- list.hoverBackground#424542
- list.inactiveSelectionBackground#424542
- list.warningForeground#e8c547
- panel.background#242624
- panel.border#424542
- panelTitle.activeBorder#85e885
- panelTitle.activeForeground#e8ede8
- panelTitle.inactiveForeground#8a908a
- progressBar.background#85e885
- selection.background#85e88530
- settings.checkboxBackground#242624
- settings.checkboxBorder#424542
- settings.checkboxForeground#85e885
- settings.dropdownBackground#242624
- settings.dropdownBorder#424542
- settings.dropdownForeground#e8ede8
- settings.headerForeground#e8ede8
- settings.modifiedItemIndicator#85e885
- settings.numberInputBackground#242624
- settings.numberInputBorder#424542
- settings.numberInputForeground#e8ede8
- settings.textInputBackground#242624
- settings.textInputBorder#424542
- settings.textInputForeground#e8ede8
- sideBar.background#242624
- sideBar.foreground#b8c8b8
- sideBarSectionHeader.background#1e201e
- sideBarSectionHeader.border#424542
- sideBarSectionHeader.foreground#e8ede8
- sideBarTitle.foreground#e8ede8
- statusBar.background#1e201e
- statusBar.debuggingBackground#e8c547
- statusBar.debuggingForeground#1e201e
- statusBar.foreground#b8c8b8
- statusBar.noFolderBackground#1e201e
- statusBar.noFolderForeground#b8c8b8
- statusBarItem.prominentBackground#85e885
- statusBarItem.prominentForeground#1e201e
- statusBarItem.prominentHoverBackground#75e875
- statusBarItem.remoteBackground#8dd4a8
- statusBarItem.remoteForeground#1e201e
- tab.activeBackground#2a2d2a
- tab.activeBorderTop#85e885
- tab.activeForeground#e8ede8
- tab.border#424542
- tab.hoverBackground#424542
- tab.inactiveBackground#1e201e
- tab.inactiveForeground#8a908a
- terminal.ansiBlack#1e201e
- terminal.ansiBlue#66b3e8
- terminal.ansiBrightBlack#424542
- terminal.ansiBrightBlue#8599e8
- terminal.ansiBrightCyan#47b366
- terminal.ansiBrightGreen#75e875
- terminal.ansiBrightMagenta#d485e8
- terminal.ansiBrightRed#e87575
- terminal.ansiBrightWhite#f5f8f5
- terminal.ansiBrightYellow#e8d975
- terminal.ansiCyan#8dd4a8
- terminal.ansiGreen#85e885
- terminal.ansiMagenta#c766e8
- terminal.ansiRed#e85555
- terminal.ansiWhite#e8ede8
- terminal.ansiYellow#e8c547
- terminal.background#2a2d2a
- terminal.foreground#e8ede8
- titleBar.activeBackground#1e201e
- titleBar.activeForeground#e8ede8
- titleBar.inactiveBackground#181a18
- titleBar.inactiveForeground#8a908a
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| emphasis | — | italic |
| strong | — | bold |
| header | #85e885 | — |
| comment, punctuation.definition.comment | #8a908a | italic |
| comment keyword.codetag.notation, comment.block.documentation keyword | #8dd4a8 | — |
| string | #8dd4a8 | — |
| punctuation.definition.string.begin, punctuation.definition.string.end | #47b366 | — |
| constant, variable.other.constant | #75e875 | — |
| constant.numeric | #75e875 | — |
| keyword, storage.type, storage.modifier | #85e885 | bold |
| entity.name.function, meta.function-call | #66b3e8 | — |
| variable.parameter | #b8c8b8 | italic |
| entity.name.type.class, entity.name.class | #e8c547 | — |
| entity.name.type, storage.type | #c766e8 | italic |
| variable | #e8ede8 | — |
| variable.language | #e85555 | italic |
| entity.name.tag | #85e885 | — |
| entity.other.attribute-name | #8dd4a8 | italic |
| meta.selector | #85e885 | — |
| support.type.property-name | #66b3e8 | — |
| keyword.operator | #85e885 | — |
| punctuation | #b8c8b8 | — |
| string.regexp | #e8c547 | — |
| markup.heading | #85e885 | bold |
| markup.bold | #e8ede8 | bold |
| markup.italic | #b8c8b8 | italic |
| markup.underline.link | #66b3e8 | — |
| markup.inline.raw | #8dd4a8 | — |
| invalid | #e85555 | underline |
| invalid.deprecated | #e8c547 | strikethrough |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...