One Monokai 80s Theme
Publisher: Axiomatic StudiosThemes in package: 2
Pleasing, subtle yet colorful theme with a flat interface made with eye comfort in mind.
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.activeBorder#404968
- activityBar.background#0e101f
- activityBar.backgrounds#090b24
- activityBar.foreground#a0aac0
- activityBar.inactiveForeground#404968
- activityBarBadge.background#505FAB
- activityBarBadge.foreground#c8d5f3
- badge.background#303550
- breadcrumb.activeSelectionForeground#c8d5f3
- breadcrumb.focusForeground#c8d5f3
- breadcrumb.foreground#6b7794
- button.background#505FAB
- button.hoverBackground#5E6DB7
- button.secondaryBackground#303550
- button.secondaryHoverBackground#3D4366
- debugToolBar.background#1f2237
- debugToolBar.border#1f2237
- disabledForeground#6b7794
- dropdown.background#303550
- dropdown.border#303550
- editor.background#1f2237
- editor.findMatchBackground#303656
- editor.findMatchHighlightBackground#4E5989bb
- editor.foreground#a6b1c9
- editor.hoverHighlightBackground#303656
- editor.inactiveSelectionBackground#303656
- editor.lineHighlightBackground#49507824
- editor.rangeHighlightBackground#303656
- editor.selectionBackground#303656
- editor.selectionHighlightBackground#4E5989bb
- editor.wordHighlightBackground#303656
- editor.wordHighlightStrongBackground#333852
- editorBracketHighlight.foreground1#a6b1c9
- editorBracketHighlight.foreground2#61A2EF
- editorBracketHighlight.foreground3#a6b1c9
- editorBracketHighlight.foreground4#61A2EF
- editorBracketHighlight.foreground5#a6b1c9
- editorBracketHighlight.foreground6#61A2EF
- editorBracketMatch.background#303656
- editorBracketMatch.border#404968B0
- editorBracketPairGuide.activeBackground1#a6b1c938
- editorBracketPairGuide.activeBackground2#6182EF38
- editorBracketPairGuide.activeBackground3#a6b1c938
- editorBracketPairGuide.activeBackground4#6182EF38
- editorBracketPairGuide.activeBackground5#a6b1c938
- editorBracketPairGuide.activeBackground6#6182EF38
- editorBracketPairGuide.background1#a6b1c938
- editorBracketPairGuide.background2#6182EF38
- editorBracketPairGuide.background3#a6b1c938
- editorBracketPairGuide.background4#6182EF38
- editorBracketPairGuide.background5#a6b1c938
- editorBracketPairGuide.background6#6182EF38
- editorCodeLens.foreground#404968
- editorCursor.foreground#6075ED
- editorError.background#00000000
- editorError.border#00000000
- editorError.foreground#e57685
- editorGroup.border#282d43
- editorGroup.dropBackground#1f2237
- editorGroupHeader.noTabsBackground#0e101f
- editorGroupHeader.tabsBackground#0e101f
- editorHoverWidget.background#303550
- editorHoverWidget.border#303550
- editorIndentGuide.activeBackground#404968B0
- editorIndentGuide.background#40496829
- editorInfo.background#00000000
- editorInfo.border#00000000
- editorInfo.foreground#6CCBE0
- editorLineNumber.activeForeground#c8d5f3
- editorLineNumber.foreground#404968
- editorSuggestWidget.background#0e101f
- editorSuggestWidget.border#0e101f00
- editorSuggestWidget.foreground#a6b1c9
- editorSuggestWidget.highlightForeground#c8d5f3
- editorSuggestWidget.selectedBackground#303656
- editorWarning.background#00000000
- editorWarning.border#00000000
- editorWarning.foreground#E09A6C
- editorWhitespace.foreground#1f2237
- editorWidget.background#0e101f
- editorWidget.resizeBorder#282d43
- errorForeground#e57685
- explorer.deemphasizedForeground#c8d5f3
- focusBorder#282d4300
- foreground#a6b1c9
- gitDecoration.addedResourceForeground#56B6C2
- gitDecoration.conflictingResourceForeground#d491cf
- gitDecoration.deletedResourceForeground#e57685
- gitDecoration.ignoredResourceForeground#576181
- gitDecoration.modifiedResourceForeground#C9B999
- gitDecoration.renamedResourceForeground#56B6C2
- gitDecoration.stageDeletedResourceForeground#e57685
- gitDecoration.stageModifiedResourceForeground#C9B999
- gitDecoration.submoduleResourceForeground#d491cf
- gitDecoration.untrackedResourceForeground#56B6C2
- input.background#303550
- input.border#303550
- inputValidation.errorBackground#e57685
- inputValidation.errorBorder#e57685
- inputValidation.errorForeground#E8DCDE
- inputValidation.infoBackground#61A2EF
- inputValidation.infoBorder#61A2EF
- inputValidation.infoForeground#D9E4EE
- inputValidation.warningBackground#E0936C
- inputValidation.warningBorder#E0936C
- inputValidation.warningForeground#EFDFD8
- list.activeSelectionBackground#0e101f
- list.dropBackground#505FAB
- list.errorForeground#e57685
- list.focusBackground#0e101f
- list.focusHighlightForeground#61A2EF
- list.highlightForeground#61A2EF
- list.hoverBackground#1f2237
- list.inactiveSelectionBackground#0e101f
- list.invalidItemForeground#e57685
- list.warningForeground#E09A6C
- menu.background#2B3149
- menu.foreground#a6b1c9
- menu.selectionForeground#a6b1c9
- menu.separatorBackground#1f2237
- menubar.selectionBackground#0e101f
- menubar.selectionForeground#a6b1c9
- minimap.errorHighlight#e57685
- minimap.warningHighlight#E09A6C
- notificationLink.foreground#61A2EF
- panel.background#1f2237
- panel.border#0e101f
- panelSection.dropBackground#1f2237
- panelSectionHeader.background#1f2237
- panelTitle.activeBorder#1f223700
- panelTitle.activeForeground#c8d5f3
- panelTitle.inactiveForeground#6b7794
- peekView.border#0e101f
- peekViewEditor.background#0e101f
- peekViewEditor.matchHighlightBackground#333942
- peekViewEditorGutter.background#0e101f
- peekViewResult.background#0e101f
- peekViewResult.fileForeground#6b7794
- peekViewResult.lineForeground#a6b1c9
- peekViewResult.matchHighlightBackground#282d43
- peekViewResult.selectionBackground#0e101f
- peekViewResult.selectionForeground#a6b1c9
- peekViewTitle.background#0e101f
- peekViewTitleDescription.foreground#6b7794
- peekViewTitleLabel.foreground#fff
- pickerGroup.foreground#61A2EF
- problemsErrorIcon.foreground#e57685
- problemsInfoIcon.foreground#6CCBE0
- problemsWarningIcon.foreground#E09A6C
- progressBar.background#505FAB
- sash.hoverBorder#282d43
- scrollbar.shadow#1f223700
- scrollbarSlider.activeBackground#58618d35
- scrollbarSlider.background#454c6e35
- scrollbarSlider.hoverBackground#58618d35
- selection.background#495078
- sideBar.background#0e101f
- sideBar.foreground#949fb8
- sideBarSectionHeader.background#0e101f
- sideBarSectionHeader.foreground#a0aac0
- sideBarTitle.foreground#a0aac0
- statusBar.background#0e101f
- statusBar.debuggingBackground#0e101f
- statusBar.debuggingForeground#61A2EF
- statusBar.foreground#949fb8
- statusBar.noFolderBackground#0e101f
- statusBar.noFolderForeground#949fb8
- symbolIcon.fieldForeground#61A2EF
- symbolIcon.interfaceForeground#61A2EF
- symbolIcon.variableForeground#61A2EF
- tab.activeForeground#c8d5f3
- tab.border#0e101f00
- tab.inactiveBackground#0e101f
- tab.inactiveForeground#6b7794
- tab.unfocusedActiveForeground#6b7794
- tab.unfocusedInactiveForeground#6b7794
- terminal.ansiBlack#6F7887
- terminal.ansiBlue#61A2EF
- terminal.ansiBrightBlack#6F7887
- terminal.ansiBrightBlue#61A2EF
- terminal.ansiBrightCyan#56B6C2
- terminal.ansiBrightGreen#86bb94
- terminal.ansiBrightMagenta#d491cf
- terminal.ansiBrightRed#e57685
- terminal.ansiBrightWhite#a6b1c9
- terminal.ansiBrightYellow#C9B999
- terminal.ansiCyan#56B6C2
- terminal.ansiGreen#86bb94
- terminal.ansiMagenta#d491cf
- terminal.ansiRed#e57685
- terminal.ansiWhite#a6b1c9
- terminal.ansiYellow#C9B999
- terminal.foreground#a6b1c9
- textLink.activeForeground#505FAB
- textLink.foreground#505FAB
- titleBar.activeBackground#0e101f
- titleBar.activeForeground#949fb8
- titleBar.border#0e101f
- titleBar.inactiveBackground#0e101f
- titleBar.inactiveForeground#6b7794
- toolbar.activeBackground#242a47
- toolbar.hoverBackground#0e101f
- toolbar.hoverOutline#00000000
- tree.indentGuidesStroke#404968bb
- widget.shadow#00000000
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| — | #a6b1c9ff | — |
| comment, string.comment | #5D688A | italic |
| storage.type.class.jsdoc | #404968 | italic |
| entity.name.type.instance.jsdoc | #5D688A | italic |
| string | #C9B999 | — |
| constant.numeric | #D19A66 | — |
| string.embedded.begin, string.embedded.end | #D19A66 | — |
| string.embedded | #D19A66 | — |
| constant.language | #61A2EF | — |
| constant.language.boolean.true | #61A2EF | — |
| constant.language.boolean.false, constant.language.null, constant.language.nan, constant.language.undefined | #e57685 | — |
| constant.language.import-export-all | #a6b1c9 | — |
| constant.character, constant.other, variable.other.constant | #a6b1c9 | — |
| variable.language | #61A2EF | — |
| variable.readwrite, variable.readwrite.other.block | #a6b1c9 | — |
| keyword | #61A2EF | — |
| variable.language.this, variable.language.this.js | #c8d5f3 | — |
| keyword.operator | #a6b1c9 | — |
| keyword.operator.assignment.js | #a6b1c9 | — |
| storage | #61A2EF | — |
| storage.type | #61A2EF | — |
| source.cs storage.type | #56B6C2 | — |
| entity.name.class, entity.name.module, entity.name.type, storage.identifier, support.class | #56B6C2 | — |
| variable.other.object | #a6b1c9 | — |
| variable.other.block | #a6b1c9 | — |
| support.variable.property, variable.other.property, variable.other.object.property | #8E9FDA | — |
| variable.other.readwrite | #a6b1c9 | — |
| variable.other.readwrite.alias | #a6b1c9 | — |
| entity.other.inherited-class | #a6b1c9 | — |
| entity.name.function | #d491cf | — |
| variable.parameter | #86bb94 | — |
| entity.name.function-call | #d491cf | — |
| function.support.builtin, function.support.core | #d491cf | — |
| entity.name.tag, entity.name.tag.class.js, entity.name.tag.class.jsx | #61A2EF | — |
| entity.name.tag.class | #8E9FDA | — |
| meta.tag.sgml.doctype.html | #61A2EF | — |
| entity.other.attribute-name | #8E9FDA | — |
| support.function | #d491cf | — |
| support.constant | #56B6C2 | — |
| support.type, support.variable | #56B6C2 | — |
| support.dictionary.json, source.json support.type | #a6b1c9 | — |
| source.json string | #C9B999 | — |
| support.type.property-name.css, support.type.property-name.scss, support.type.property-name.less, support.type.property-name.sass | #a6b1c9 | — |
| support.constant.css, support.constant.scss, support.constant.less, support.constant.sass | #d491cf | — |
| variable.css, variable.scss, variable.less, variable.sass | #d491cf | — |
| variable.css.string, variable.scss.string, variable.less.string, variable.sass.string | #a6b1c9 | — |
| unit.css, unit.scss, unit.less, unit.sass | #D19A66 | — |
| meta.property-value.css constant.numeric.css, meta.property-value.scss constant.numeric.scss, meta.property-value.less constant.numeric.less, meta.property-value.sass constant.numeric.sass | #D19A66 | — |
| source.css constant.other | #D19A66 | — |
| source.css support.constant | #d491cf | — |
| function.css, function.scss, function.less, function.sass | #d491cf | — |
| entity.name.tag.css, entity.name.tag.scss, entity.name.tag.less, entity.name.tag.sass | #56B6C2 | — |
| entity.other.attribute-name.css, entity.other.attribute-name.scss, entity.other.attribute-name.less, entity.other.attribute-name.sasscss | #61A2EF | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.class.scss, entity.other.attribute-name.class.less, entity.other.attribute-name.class.sass | #61A2EF | — |
| entity.other.attribute-name.id.css, entity.other.attribute-name.id.scss, entity.other.attribute-name.id.less, entity.other.attribute-name.id.sass | #86bb94 | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-class.scss, entity.other.attribute-name.pseudo-class.less, entity.other.attribute-name.pseudo-class.sass | #8E9FDA | — |
| entity.other.attribute-name.pseudo-element.css, entity.other.attribute-name.pseudo-element.scss, entity.other.attribute-name.pseudo-element.less, entity.other.attribute-name.pseudo-element.sass | #8E9FDA | — |
| meta.at-rule.media.css, meta.at-rule.media.scss, meta.at-rule.media.less, meta.at-rule.media.sass | #61A2EF | — |
| source.css keyword, source.css keyword.operator.logical, source.css keyword.operator.constructor, source.scss keyword, source.scss keyword.operator.logical, source.scss keyword.operator.constructor, source.less keyword, source.less keyword.operator.logical, source.less keyword.operator.constructor, source.sass keyword, source.sass keyword.operator.logical, source.sass keyword.operator.constructor | #61A2EF | — |
| source.css keyword.other.unit | #D19A66 | — |
| source.css support.type.vendored.property-name.css | #6F7887 | — |
| source.css support.function | #d491cf | — |
| source.css variable.parameter | #D4C19B | — |
| source.css variable.other | #86bb94 | — |
| support.other.variable | — | |
| invalid | #F8F8F0 | — |
| invalid.deprecated | #F8F8F0 | — |
| string.detected-link | #61A2EF | — |
| meta.diff, meta.diff.header | #4B525B | — |
| markup.deleted | #e57685 | — |
| markup.inserted | #86bb94 | — |
| markup.changed | #D1BF94 | — |
| constant.numeric.line-number.find-in-files - match | #56B6C2A0 | — |
| entity.name.filename.find-in-files | #a6b1c9 | — |
| entity.name.tag.xml, entity.name.tag.xml.html,entity.name.tag.html | #61A2EF | — |
| entity.name.tag.namespace.xml, entity.other.attribute-name.namespace.xml | #86bb94 | — |
| punctuation.definition.tag.xml,punctuation.definition.tag.html, punctuation.definition.tag | #a6b1c9 | — |
| entity.name.tag.localname.xml | #61A2EF | — |
| entity.other.attribute-name.xml, entity.other.attribute-name.localname.xml,entity.other.attribute-name.html | #d491cf | — |
| keyword.other.entitytype.xml, keyword.other.entity.xml, keyword.other.page-props.xml | #E5C07B | — |
| meta.attribute-with-value.id.html meta.toc-list.id.html, meta.attribute-with-value.id.html string.quoted.double.html | #86bb94 | — |
| token.info-token | #658ce6 | — |
| token.warn-token | #cd9731 | — |
| token.error-token | #f44747 | — |
| token.debug-token | #b267e6 | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...