Menthol Theme
Publisher: UltraKostikThemes in package: 2
Modern and minimalistic color theme with mint accents and warm contrasting colors for focus, optimized for semantic highlighting across major programming languages.
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#0A1A22
- activityBar.foreground#70D0E8
- activityBarBadge.background#4AB89A
- activityBarBadge.foreground#060C12
- badge.background#4AB89A
- badge.foreground#060C12
- breadcrumb.activeSelectionForeground#70D0E8
- breadcrumb.background#060C12
- breadcrumb.focusForeground#C8D8E0
- breadcrumb.foreground#6A9A9A
- button.background#4AB89A
- button.hoverBackground#5AC8AA
- button.secondaryBackground#1A2A3A
- button.secondaryForeground#C8D8E0
- button.secondaryHoverBackground#2A3A4A
- chat.requestBackground#0A1A22
- chat.responseBackground#060C12
- chat.slashCommandBackground#122A32
- chat.slashCommandForeground#C8D8E0
- debugExceptionWidget.background#122A32
- debugExceptionWidget.border#D07070
- debugToolBar.background#060C12
- debugToolBar.border#122A32
- diffEditor.border#1A3A42
- diffEditor.insertedTextBackground#70C8A033
- diffEditor.insertedTextBorder#70C8A0
- diffEditor.removedTextBackground#D0707033
- diffEditor.removedTextBorder#D07070
- dropdown.background#060C12
- dropdown.border#1A3A42
- dropdown.foreground#C8D8E0
- editor.background#060C12
- editor.findMatchBackground#4AB89A33
- editor.findMatchHighlightBackground#4AB89A22
- editor.findRangeHighlightBackground#4AB89A11
- editor.foreground#C8D8E0
- editor.selectionBackground#122A32
- editor.wordHighlightBackground#0A1A22
- editorBracketHighlight.foreground1#4AB89A
- editorBracketHighlight.foreground2#70D0E8
- editorBracketHighlight.foreground3#80D8A8
- editorBracketHighlight.foreground4#D0C070
- editorBracketHighlight.foreground5#D090A8
- editorBracketHighlight.foreground6#7A7AC8
- editorBracketMatch.background#122A32
- editorBracketMatch.border#1A3A42
- editorCodeLens.foreground#5A7A7A
- editorGroup.dropBackground#122A3233
- editorGroupHeader.tabsBackground#0A1A22
- editorGutter.addedBackground#70C8A0
- editorGutter.deletedBackground#D07070
- editorGutter.modifiedBackground#70D0E8
- editorHoverWidget.background#0A1A22
- editorHoverWidget.border#1A3A42
- editorHoverWidget.foreground#C8D8E0
- editorInlayHint.activeBackground#1A3A42
- editorInlayHint.activeForeground#C8D8E0
- editorInlayHint.background#122A32
- editorInlayHint.foreground#3A6A6A
- editorInlayHint.parameterForeground#D0A890
- editorInlayHint.typeForeground#C090D0
- editorLineNumber.activeForeground#70D0E8
- editorLineNumber.foreground#1A3A42
- editorOverviewRuler.background#060C12
- editorOverviewRuler.border#122A32
- editorOverviewRuler.errorForeground#D07070
- editorOverviewRuler.infoForeground#70D0E8
- editorOverviewRuler.warningForeground#C8C880
- editorSuggestWidget.background#0A1A22
- editorSuggestWidget.foreground#C8D8E0
- editorSuggestWidget.highlightForeground#4AB89A
- editorSuggestWidget.selectedBackground#122A32
- editorWidget.resizeBorder#4AB89A
- focusBorder#5AC8AA
- gitDecoration.addedResourceForeground#70C8A0
- gitDecoration.conflictingResourceForeground#D090A8
- gitDecoration.deletedResourceForeground#D07070
- gitDecoration.ignoredResourceForeground#3A5A5A
- gitDecoration.modifiedResourceForeground#C8C880
- gitDecoration.untrackedResourceForeground#4AB89A
- input.background#060C12
- input.border#1A3A42
- input.foreground#C8D8E0
- input.placeholderForeground#3A6A6A
- list.activeSelectionBackground#122A32
- list.activeSelectionForeground#C8D8E0
- list.highlightForeground#4AB89A
- list.hoverBackground#122A32
- list.hoverForeground#C8D8E0
- list.inactiveSelectionBackground#0A1A22
- list.inactiveSelectionForeground#C8D8E0
- listFilterWidget.background#0A1A22
- listFilterWidget.noMatchesOutline#D07070
- listFilterWidget.outline#4AB89A
- menu.background#0A1A22
- menu.border#122A32
- menu.foreground#C8D8E0
- menu.selectionBackground#122A32
- menu.separatorBackground#1A3A42
- merge.commonContentBackground#060606
- merge.commonHeaderBackground#0A0A0A
- merge.currentContentBackground#0A1A22
- merge.currentHeaderBackground#122A32
- merge.incomingContentBackground#0A1A22
- merge.incomingHeaderBackground#1A2A42
- minimap.background#060C12
- minimap.errorHighlight#D0707033
- minimap.findMatchHighlight#4AB89A33
- minimap.selectionHighlight#70D0E833
- minimapGutter.addedBackground#70C8A0
- minimapGutter.deletedBackground#D07070
- minimapGutter.modifiedBackground#70D0E8
- notifications.background#0A1A22
- notifications.foreground#C8D8E0
- notificationToast.border#1A3A42
- panel.background#060C12
- panel.border#122A32
- panelSectionHeader.background#0A1A22
- panelSectionHeader.border#122A32
- panelSectionHeader.foreground#C8D8E0
- peekView.border#4AB89A
- peekViewEditor.background#060C12
- peekViewEditor.matchHighlightBackground#4AB89A33
- peekViewEditor.matchHighlightBorder#4AB89A
- peekViewEditorGutter.background#060C12
- peekViewResult.background#0A1A22
- peekViewResult.fileForeground#C8D8E0
- peekViewResult.lineForeground#3A6A6A
- peekViewResult.matchHighlightBackground#4AB89A33
- peekViewResult.selectionBackground#122A32
- peekViewTitle.background#0A1A22
- peekViewTitleLabel.foreground#C8D8E0
- ports.iconRunningProcessForeground#4AB89A
- progressBar.background#5AC8AA
- scrollbar.shadow#060C12
- scrollbarSlider.background#122A32
- scrollbarSlider.hoverBackground#1A3A42
- settings.focusedRowBackground#122A32
- settings.focusedRowBorder#1A3A42
- settings.headerBorder#122A32
- settings.headerForeground#C8D8E0
- sideBar.background#060C12
- sideBarSectionHeader.background#060C12
- sideBarSectionHeader.border#122A32
- sideBarSectionHeader.foreground#C8D8E0
- sideBarTitle.foreground#70D0E8
- statusBar.background#0A1A22
- statusBar.border#122A32
- statusBar.foreground#C8D8E0
- statusBarItem.activeBackground#122A32
- statusBarItem.errorBackground#D07070
- statusBarItem.errorForeground#060C12
- statusBarItem.hoverBackground#122A32
- statusBarItem.prominentBackground#4AB89A
- statusBarItem.prominentForeground#060C12
- statusBarItem.remoteBackground#4AB89A
- statusBarItem.remoteForeground#060C12
- tab.activeBackground#060C12
- tab.activeBorder#4AB89A
- tab.inactiveBackground#0A1A22
- tab.unfocusedActiveBorder#4AB89A
- tab.unfocusedInactiveBackground#0A1A22
- terminal.ansiBlack#060C12
- terminal.ansiBlue#4AB89A
- terminal.ansiBrightBlue#70D0E8
- terminal.ansiBrightGreen#70C8A0
- terminal.ansiBrightRed#D07070
- terminal.ansiBrightYellow#C8C880
- terminal.ansiCyan#5AA8A8
- terminal.ansiGreen#4AB89A
- terminal.ansiRed#D07070
- terminal.ansiWhite#C8D8E0
- terminal.ansiYellow#C8C880
- terminal.background#060C12
- terminal.foreground#C8D8E0
- textLink.foreground#4AB89A
- titleBar.activeBackground#060C12
- titleBar.border#122A32
- tree.indentGuidesStroke#1A3A42
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #4A8A7A | italic |
| keyword, storage.type, storage.modifier | #4AB89A | — |
| support.type, entity.name.type, keyword.other.type.php | #4AA8B8 | — |
| storage.modifier | #5ABA8A | — |
| entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method | #70D0E8 | — |
| keyword.function.go | #70D0E8 | — |
| storage.type.function.js | #70D0E8 | — |
| keyword.control.lua | #70D0E8 | — |
| storage.type.function.php | #70D0E8 | — |
| meta.function.c,meta.function.cpp | #70D0E8 | — |
| entity.name.function.cs | #70D0E8 | — |
| entity.name.function.java | #70D0E8 | — |
| entity.name.field.graphql | #70D0E8 | — |
| variable.argument.graphql | #D0A890 | — |
| entity.name.model.prisma | #D0C070 | — |
| entity.name.field.prisma | #70D0E8 | — |
| keyword.control.import, keyword.control.import.ts, keyword.control.import.swift, keyword.control.import.js, keyword.control.import.go, keyword.other.import.dart, keyword.control.at-rule.import.css, storage.modifier.import, storage.modifier.import.java, keyword.control.export | #5AA8A8 | — |
| keyword.control.import.from.python | #5AA8A8 | — |
| keyword.control.import.as.python | #5AA8A8 | — |
| keyword.control.directive.include.c, keyword.control.directive.include.cpp, keyword.control.import.include.php | #5AA8A8 | — |
| keyword.other.special-method.ruby | #5AA8A8 | — |
| string, constant.other.symbol, constant.other.key, markup.heading | #70C8A0 | — |
| constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter | #D0A890 | — |
| meta.function-call.arguments, meta.function-call.arguments.python, meta.function-call.js variable.other.readwrite.js, meta.argument.shell | #D8B860 | — |
| entity.name, support.type, support.class, entity.name.class | #D0C070 | — |
| entity.name.tag, meta.tag.sgml | #4AB89A | — |
| entity.other.attribute-name | #70D0E8 | — |
| keyword.control, punctuation, meta.tag, punctuation.definition.tag | #5AA8A8 | bold |
| variable, variable.assignment, string constant.other.placeholder | #C8D8E0 | — |
| meta.decorator, entity.name.function.decorator | #D090A8 | bold |
| meta.function.decorator.python, entity.name.function.decorator.python | #D090A8 | bold |
| meta.decorator.ts entity.name.function.ts | #D090A8 | bold |
| storage.type.annotation.java | #D090A8 | bold |
| support.attribute.php | #D090A8 | bold |
| support.attribute.builtin.php | #D090A8 | bold |
| storage.type.annotation.dart | #D090A8 | bold |
| storage.type.annotation.groovy | #D090A8 | bold |
| storage.modifier.attribute.swift | #D090A8 | bold |
| punctuation.definition.decorator | #D090A8 | bold |
| support.variable.magic.python | #D0A890 | italic |
| variable.parameter.function.language.special.self.python | #7A7AC8 | italic |
| storage.modifier.lifetime.rust | #5AA8A8 | — |
| entity.name.lifetime.rust | #C090D0 | italic |
| entity.name.package.go | #D0C070 | — |
| support.type.go | #4AA8B8 | — |
| keyword.other.sql | #4AB89A | — |
| support.function.sql | #70D0E8 | — |
| entity.name.tag.yaml | #70D0E8 | — |
| string.quoted.double.yaml | #70C8A0 | — |
| entity.name.tag.toml | #70D0E8 | — |
| string.quoted.double.toml | #70C8A0 | — |
| variable.other.normal.shell | #C8D8E0 | — |
| support.function.shell | #70D0E8 | — |
| keyword.control.dockerfile | #4AB89A | — |
| support.function.dockerfile | #70D0E8 | — |
| markup.inserted.git_gutter | #70C8A0 | — |
| markup.deleted.git_gutter | #D07070 | — |
| markup.changed.git_gutter | #C8C880 | — |
| invalid, invalid.illegal | #D06060 | — |
| invalid.deprecated | #C8C880 | strikethrough |
| string.regexp | #70D0E8 | — |
| *url*, *link*, *uri* | #70D0E8 | underline |
| markup.bold | #D0C070 | bold |
| markup.italic | #70C8A0 | italic |
| string.other.link.title.markdown | #70D0E8 | — |
| support.type.property-name.json | #70D0E8 | — |
| support.type.property-name | #D0C070 | — |
| entity.other.attribute-name.class, entity.other.attribute-name.id, entity.name.tag.css | #70C8A0 | — |
| keyword.other.unit.css | #D0A890 | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #5AA8A8 | italic |
| support.constant.color.w3c-standard-color-name.css | #C090D0 | — |
| support.type, constant.language, meta.type.annotation | #C090D0 | italic |
| support.type.exception | #D07070 | bold |
| variable.parameter.function.language.special.self.python, variable.language.special.self.python, variable.language.this | #7A7AC8 | italic |
| variable.language.this.java | #7A7AC8 | italic |
| variable.language.this.cpp | #7A7AC8 | italic |
| variable.language.this.php | #7A7AC8 | italic |
| variable.language.this.js | #7A7AC8 | italic |
| variable.language.this.ts | #7A7AC8 | italic |
| variable.language.self.ruby | #7A7AC8 | italic |
| variable.language.self.rust | #7A7AC8 | italic |
| keyword.operator.new.js | #6A7AB8 | italic |
| keyword.operator.new.ts | #6A7AB8 | italic |
| keyword.control.new.java | #6A7AB8 | italic |
| keyword.operator.new.cpp | #6A7AB8 | italic |
| keyword.operator.expression.new.cs | #6A7AB8 | italic |
| keyword.other.new.php | #6A7AB8 | italic |
| keyword.new.dart | #6A7AB8 | italic |
| keyword.control.new.groovy | #6A7AB8 | italic |
| support.function.magic | #70D0E8 | italic |
| markup.heading | #D0C070 | bold |
| markup.bold.markdown | #D0C070 | bold |
| markup.italic.markdown | #70C8A0 | italic |
| markup.bold.markdown markup.italic.markdown | #D090A8 | italic bold |
| markup.underline.link.markdown | #70D0E8 | underline |
| markup.quote.markdown | #5AA8A8 | italic |
| markup.fenced_code.block.markdown | #C8D8E0 | — |
| markup.list.markdown | #4AB89A | — |
| meta.embedded.line.css support.type.property-name.css | #D0C070 | — |
| meta.embedded.line.css support.constant.property-value.css | #70C8A0 | — |
| keyword.operator.expression.instanceof | #4AB89A | — |
| keyword.operator.instanceof.java | #4AB89A | — |
| keyword.operator.expression.instanceof.js | #4AB89A | — |
| markup.inserted.diff | #70C8A0 | — |
| markup.deleted.diff | #D07070 | — |
| markup.changed.diff | #C8C880 | — |
| punctuation.definition.parameters.begin.python, punctuation.definition.parameters.end.python, punctuation.separator.parameters.python | #5AA8A8 | — |
| punctuation.definition.parameters.begin.java, punctuation.definition.parameters.end.java, punctuation.separator.parameters.java | #5AA8A8 | — |
| punctuation.definition.parameters.begin.js, punctuation.definition.parameters.end.js, punctuation.separator.parameters.js | #5AA8A8 | — |