Monokai X Atom Material
Publisher: LeviThemes in package: 1
A combo of the Monokai Charcoal (purple) theme and the Atom Material theme.
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#000000
- activityBar.border#ae81ff75
- activityBar.foreground#ae81ff
- activityBar.inactiveForeground#ae81ff75
- activityBarBadge.background#000000
- activityBarBadge.foreground#ae81ff
- badge.background#000000
- badge.foreground#ae81ff
- breadcrumb.foreground#ae81ff
- button.background#000000
- button.foreground#ffffff
- button.hoverBackground#000000
- checkbox.border#ae81ff75
- contrastActiveBorder#000000
- contrastBorder#ae81ff75
- debugExceptionWidget.background#000000
- debugExceptionWidget.border#ae81ff
- debugToolBar.background#000000
- debugToolBar.border#ae81ff
- diffEditor.insertedTextBackground#31958a55
- diffEditor.insertedTextBorder#31958a55
- diffEditor.removedTextBackground#892f4688
- diffEditor.removedTextBorder#31958a55
- dropdown.background#000000
- dropdown.border#ae81ff75
- dropdown.foreground#ffffff
- editor.background#000000
- editor.findMatchBackground#6688cc
- editor.findMatchBorder#ae81ff75
- editor.findMatchHighlightBackground#eeeeee44
- editor.foreground#ffffff
- editor.inactiveSelectionBackground#6688cc
- editor.lineHighlightBorder#ae81ff75
- editor.selectionBackground#6688cc
- editor.selectionForeground#000c18
- editorGroup.border#ae81ff75
- editorGroupHeader.border#000000
- editorGroupHeader.noTabsBackground#000000
- editorGroupHeader.tabsBackground#000000
- editorGroupHeader.tabsBorder#ae81ff75
- editorHint.foreground#43b9d8
- editorHoverWidget.background#000000
- editorHoverWidget.border#ae81ff75
- editorIndentGuide.activeBackground#505050
- editorLineNumber.activeForeground#ae81ff
- editorLineNumber.foreground#ae81ff
- editorLink.activeForeground#0063a5
- editorMarkerNavigation.background#060621
- editorMarkerNavigationError.background#ab395b
- editorMarkerNavigationWarning.background#5b7e7a
- editorSuggestWidget.background#000000
- editorSuggestWidget.border#ae81ff
- editorSuggestWidget.foreground#ffffff
- editorSuggestWidget.highlightForeground#43b9d8
- editorSuggestWidget.selectedBackground#ae81ff75
- editorWidget.background#000000
- editorWidget.border#000000
- focusBorder#ae81ff75
- foreground#ffffff
- icon.foreground#ffffff
- input.background#000000
- input.border#ae81ff75
- input.foreground#ffffff
- input.placeholderForeground#ae81ff75
- list.activeSelectionBackground#43b9d815
- list.hoverBackground#43b9d815
- list.inactiveSelectionBackground#ae81ff15
- menu.background#000000
- menu.border#ae81ff75
- merge.border#ae81ff75
- notificationCenter.border#ae81ff
- notificationCenterHeader.background#000000
- notificationCenterHeader.foreground#ffffff
- notifications.background#000000
- notifications.border#ae81ff75
- notifications.foreground#ffffff
- panel.background#000000
- panel.border#ae81ff75
- panelTitle.activeForeground#ae81ff
- panelTitle.inactiveForeground#ae81ff75
- peekView.border#ae81ff75
- peekViewTitle.background#000000
- peekViewTitleLabel.foreground#ffffff
- quickInput.background#000000
- sideBar.background#000000
- sideBar.border#ae81ff75
- sideBar.foreground#ffffff
- sideBarSectionHeader.background#000000
- sideBarSectionHeader.border#ae81ff75
- sideBarSectionHeader.foreground#ae81ff
- sideBarTitle.foreground#ae81ff
- statusBar.background#000000
- statusBar.border#ae81ff75
- statusBar.debuggingBackground#43b9d815
- statusBar.debuggingForeground#ae81ff
- statusBar.foreground#ae81ff
- statusBar.noFolderBackground#000000
- statusBar.noFolderForeground#ae81ff
- tab.activeBackground#000000
- tab.activeBorder#000000
- tab.activeForeground#ffffff
- tab.activeModifiedBorder#ae81ff75
- tab.border#ae81ff75
- tab.hoverBorder#ae81ff75
- tab.inactiveBackground#000000
- tab.inactiveForeground#ffffff
- tab.inactiveModifiedBorder#ae81ff75
- tab.unfocusedActiveBorder#000000
- tab.unfocusedActiveForeground#ffffff
- tab.unfocusedInactiveForeground#ffffff
- terminal.ansiBlack#8f8f8f
- terminal.ansiBlue#5ccaef
- terminal.ansiBrightBlack#8f8f8f
- terminal.ansiBrightBlue#5ccaef
- terminal.ansiBrightCyan#a57fff
- terminal.ansiBrightGreen#98d800
- terminal.ansiBrightMagenta#f57f00
- terminal.ansiBrightRed#f82a5d
- terminal.ansiBrightWhite#f1f1f1
- terminal.ansiBrightYellow#e7dc60
- terminal.ansiCyan#a57fff
- terminal.ansiGreen#98d800
- terminal.ansiMagenta#f57f00
- terminal.ansiRed#f82a5d
- terminal.ansiWhite#f1f1f1
- terminal.ansiYellow#e7dc60
- terminal.border#ae81ff75
- titleBar.activeBackground#000000
- titleBar.activeForeground#ae81ff
- titleBar.border#ae81ff75
- titleBar.inactiveBackground#000000
- titleBar.inactiveForeground#ae81ff
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| source, punctuation.definition.dictionary, punctuation.separator.dictionary.pair, entity.name.type.instance, punctuation.section.property-list.begin.bracket.curly.css, punctuation.section.property-list.end.bracket.curly.css, punctuation.definition.constant.css, meta.property-name.css, meta.property-value.css, punctuation.section.function.begin.bracket.round.css, punctuation.section.function.end.bracket.round.css, punctuation.section.media.begin.bracket.curly.css, punctuation.section.media.end.bracket.curly.css, punctuation.separator.list.comma.css, meta.paragraph.markdown, text.html.markdown, text.html.basic, punctuation.definition.variable.less, text.jade, punctuation.section.property-list.begin.bracket.curly.scss, punctuation.section.property-list.end.bracket.curly.scss, variable.interpolation.scss, punctuation.definition.bracket.curly.begin.jsdoc, punctuation.definition.bracket.curly.end.jsdoc, string.other.link.description.title.markdown, constant.language.import-export-all.js, constant.language.import-export-all.ts, constant.language.import-export-all.tsx, punctuation.separator.comma.js, meta.parameters.js | #EEFFFF | — |
| variable.other, variable.assignment, constant.other.color, support.constant.color, variable.other.object | #F8EB89 | — |
| punctuation, keyword.operator, meta.brace, support.constant, support.type.object.module.js, meta.group.regexp, string.regexp.js | #89DDF3 | — |
| support.type.property-name, string.quoted, meta.object-literal.key, source.coffee.embedded.source, entity.name.section.markdown, punctuation.definition.heading.markdown, string.unquoted.plain.out.yaml, string.template.js, string.interpolated.jade, support.type.builtin.graphql | #C3E88D | — |
| constant.numeric, variable.parameter.function, keyword.other.unit | #F78C6A | — |
| constant.language, entity.name.tag.html, entity.name.tag.structure.any.html, entity.name.tag.inline.any.html, entity.name.tag.block.any.html, constant.other.table-name.sql, constant.other.database-name.sql, entity.name.tag.xml, entity.name.tag.localname.xml, entity.name.tag.yaml, entity.name.tag.style.html, entity.name.tag.other.html, support.variable.property.js, entity.name.tag.jade, constant.name.attribute.tag.jade, entity.name.tag.js, entity.name.tag.ts, entity.name.tag.tsx, support.class.component.js, support.class.component.ts, support.class.component.tsx | #F07178 | — |
| comment, punctuation.definition.comment | #4F6875 | italic |
| storage.type, keyword.control, keyword.other.important.css, punctuation.definition.keyword, punctuation.definition.directive, storage.modifier.cs, keyword.other.class.cs, keyword.type.cs, markup.italic.markdown, punctuation.definition.italic.markdown, keyword.package.go, keyword.import.go, keyword.function.go, keyword.var.go, keyword.const.go, meta.tag.sgml.doctype.html, storage.modifier.java, punctuation.definition.storage.type.objc, storage.modifier.perl, keyword.other.DML.sql, keyword.other.alias.sql, storage.modifier.async.js, support.type.property-name.json, punctuation.support.type.property-name.begin.json, punctuation.support.type.property-name.end.json, keyword.other.definition.ini, punctuation.definition.block.tag.jsdoc, storage.modifier.js, storage.modifier.ts, storage.modifier.tsx, keyword.type.graphql | #C792EA | — |
| markup.italic.markdown, punctuation.definition.italic.markdown | #C792EA | italic |
| entity.name.function, support.function, variable.other.property, punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, markup.quote.markdown, meta.function-call.generic.python, keyword.other.special-method.ruby, entity.name.type.js, variable.other.object.property.js, entity.name.section.group-title.ini, support.variable.property.dom.js, support.variable.property.dom.ts, entity.name.type.ts, entity.name.type.tsx, variable.graphql | #82AAFF | — |
| markup.quote.markdown | #82AAFF | italic |
| support.class, entity.name.type.class, constant.numeric.css, entity.other.attribute-name, support.variable.object.node.js, support.variable.object.process.js, support.variable.property.process.js, support.variable.dom.js, support.constant.json.js, entity.other.inherited-class, support.variable.dom.ts, support.type.primitive.ts, entity.name.type.interface.ts, entity.name.type.module.js, entity.name.type.module.ts, entity.name.type.module.tsx, support.variable.dom.tsx, support.type.graphql | #FFCB6B | — |
| markup.bold.markdown, punctuation.definition.bold.markdown | #FFCB6B | bold |
| variable.language.super, punctuation.definition.metadata.markdown, variable.language.special.self.python, punctuation.definition.interpolation.begin.bracket.curly.scss, punctuation.definition.interpolation.end.bracket.curly.scss, variable.language.this.js, variable.language.this.ts | #FF5370 | — |
| entity.name.tag | #B2CCD6 | — |
| support.type.property-name.css, support.type.property-name.media.css, support.constant.parity.css, meta.object-literal.key.js, meta.object-literal.key.ts | #990000 | — |
| markup.underline.link.image.markdown, markup.underline.link.markdown | #FF869A | — |
| token.info-token | #6796E6 | — |
| token.warn-token | #CD9731 | — |
| token.error-token | #F44747 | — |
| token.debug-token | #B267E6 | — |