Cyber '77
Publisher: Code Reviewer14Themes in package: 1
A theme inspired by Synthwave '84 & Deepdark Material and the Cyberpunk 77 game
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#eeecf5
- activityBar.activeFocusBorder#eeecf5
- activityBar.background#060609
- activityBar.foreground#eeecf5
- activityBarBadge.background#ACDBFF
- activityBarBadge.foreground#0e0e14
- badge.background#1a1a26
- badge.foreground#eeecf5
- button.background#17171f
- button.foreground#eeecf5
- button.hoverBackground#00aeff
- diffEditor.insertedTextBackground#00919b15
- diffEditor.removedTextBackground#c3115520
- dropdown.background#060609
- dropdown.border#060609
- dropdown.foreground#eeecf599
- editor.background#17171f
- editor.findMatchBackground#408cff40
- editor.findMatchHighlightBackground#1900ff22
- editor.foreground#cdd7dc
- editor.hoverHighlightBackground#06060922
- editor.inactiveSelectionBackground#ffffff20
- editor.lineHighlightBackground#ffffff10
- editor.lineHighlightBorder#ffffff05
- editor.selectionBackground#3019ff73
- editor.selectionHighlightBackground#19abff45
- editor.selectionHighlightBorder#06060930
- editor.wordHighlightBackground#ff000000
- editor.wordHighlightStrongBackground#0e0e14
- editor.wordHighlightStrongBorder#ffffff60
- editorCodeLens.foreground#ffffff66
- editorCursor.foreground#fff
- editorError.foreground#FF5252
- editorGroup.border#181A1F
- editorGroup.emptyBackground#0e0e14
- editorGroupHeader.tabsBackground#030708
- editorGutter.addedBackground#47ffa0
- editorGutter.deletedBackground#FF5252
- editorGutter.modifiedBackground#40C4FF
- editorHoverWidget.background#060609
- editorHoverWidget.border#1E1E1E
- editorIndentGuide.background#ffffff22
- editorLineNumber.foreground#ffffff33
- editorLink.activeForeground#40C4FF
- editorOverviewRuler.addedForeground#47ffa000
- editorOverviewRuler.border#ff000000
- editorOverviewRuler.bracketMatchForeground#40C4FF00
- editorOverviewRuler.deletedForeground#E040FB00
- editorOverviewRuler.errorForeground#FF5252
- editorOverviewRuler.infoForeground#FFFF0000
- editorOverviewRuler.modifiedForeground#40C4FF00
- editorOverviewRuler.warningForeground#FFAB40
- editorRuler.foreground#ffffff66
- editorSuggestWidget.background#1E1E1E
- editorSuggestWidget.border#1E1E1E
- editorSuggestWidget.foreground#f8f8f0
- editorSuggestWidget.highlightForeground#4CC9F0
- editorSuggestWidget.selectedBackground#2c313a
- editorWarning.foreground#FFAB40
- editorWhitespace.foreground#ffffff66
- editorWidget.background#0e0e14
- editorWidget.border#17171f
- errorForeground#FF5252
- extensionButton.prominentBackground#47ffa0
- extensionButton.prominentForeground#0A0A0A
- extensionButton.prominentHoverBackground#40C4FF
- focusBorder#17171f
- gitDecoration.addedResourceForeground#72f1b8cc
- gitDecoration.deletedResourceForeground#ff413b
- gitDecoration.ignoredResourceForeground#ffffff59
- gitDecoration.modifiedResourceForeground#ffb77cee
- gitDecoration.untrackedResourceForeground#72f1b8
- input.background#0e0e14
- input.border#2f2f40
- input.foreground#f8f8f0
- input.placeholderForeground#ffffff66
- inputOption.activeBackground#00000000
- inputOption.activeBorder#4CC9F0
- inputValidation.errorBackground#0A0A0A
- inputValidation.errorBorder#FF5252
- inputValidation.infoBackground#0A0A0A
- inputValidation.infoBorder#4CC9F0
- inputValidation.warningBackground#0A0A0A
- inputValidation.warningBorder#FFAB40
- list.activeSelectionBackground#ffffff20
- list.activeSelectionForeground#fff
- list.errorForeground#FF5252
- list.focusBackground#ffffff22
- list.focusForeground#f8f8f0
- list.highlightForeground#fff
- list.hoverBackground#ffffff10
- list.inactiveSelectionBackground#ffffff22
- list.inactiveSelectionForeground#f8f8f0
- list.warningForeground#FFAB40
- notificationCenter.border#262633
- notificationCenterHeader.background#20202b
- notifications.background#262633
- notifications.border#262633
- notificationToast.border#262633
- panel.background#17171f
- panel.border#262633
- panelTitle.activeBorder#ff8f3b
- pickerGroup.border#40c3ff00
- pickerGroup.foreground#40C4FF
- progressBar.background#47ffa0
- scrollbar.shadow#ff000000
- scrollbarSlider.activeBackground#ffffff99
- scrollbarSlider.background#ffffff33
- scrollbarSlider.hoverBackground#ffffff66
- sideBar.background#0e0e14
- sideBar.border#0e0e14
- sideBar.foreground#ffffff99
- sideBarSectionHeader.background#0e0e14
- sideBarSectionHeader.foreground#ffffff
- sideBarTitle.foreground#f8f8f0
- statusBar.background#0e0e14
- statusBar.debuggingBackground#f99b72
- statusBar.debuggingForeground#060609
- statusBar.foreground#fff
- statusBar.noFolderBackground#0e0e14
- statusBarItem.hoverBackground#ffffff33
- tab.activeBackground#17171f
- tab.activeBorder#4CC9F0
- tab.activeForeground#fff
- tab.border#ffffff00
- tab.hoverBackground#000
- tab.inactiveBackground#17171f
- tab.inactiveForeground#ffffff80
- terminal.background#17171f
- textLink.activeForeground#ff8f3c
- textLink.foreground#ACDBFF
- titleBar.activeBackground#060609
- titleBar.activeForeground#ffffff99
- titleBar.inactiveBackground#060609
- titleBar.inactiveForeground#ffffff99
- tree.indentGuidesStroke#ffffff20
- welcomePage.tileBackground#0e0e14
- welcomePage.tileHoverBackground#13131b
- widget.shadow#00000090
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment | #A1A1BA | italic |
| source.js constant | #d6498b | — |
| meta, meta.import | #e6f4ff | — |
| string.quoted | #94FFCD | — |
| string | #ffc19a | — |
| constant.numeric | #ACDBFF | — |
| constant.language | #8EA1F5 | — |
| keyword.operator | #ffc19a | — |
| punctuation.definition.binding-pattern, punctuation.definition.block | #ff8f3b | — |
| keyword.control | #ff3d7f | — |
| keyword.control.conditional | #fff9b8 | — |
| keyword.control.import | #fff9b8 | — |
| storage.type | #ffc19a | — |
| storage.modifier | #69f0ae | — |
| variable.language | #ff9431 | — |
| constant.character, constant.other | #896ef4 | |
| storage.other | #896ef4 | |
| entity.name.class, entity.name.type | #ff8f3b | |
| punctuation.separator.variable | #6089B4 | |
| support.function | #ffc107 | — |
| meta.tag punctuation.definition.string | #FF8F3B | |
| punctuation.section.embedded -(source string source punctuation.section.embedded), meta.brace.erb.html | #FF8F3B | |
| meta.tag string -source -punctuation, text source text meta.tag string -punctuation | #6089B4 | |
| meta.tag.other, entity.name.tag.style, entity.name.tag.script, meta.tag.block.script, source.js.embedded punctuation.definition.tag.html, source.css.embedded punctuation.definition.tag.html | #cecece | |
| meta.tag.inline source, text.html.php.source | #9AA83A | |
| meta.doctype, meta.tag.sgml-declaration.doctype, meta.tag.sgml.doctype | #9AA83A | |
| meta.tag.other | #D0B344 | |
| variable.other.property | #4CC9F0 | |
| meta.function-call.object | #9872A2 | |
| variable.other.normal | #6089B4 | |
| meta.brace.erb.html | #D08442 | |
| meta.object-literal.key | #eeeeee | — |
| meta.toc-list.id | #d1e260 | — |
| punctuation.section.embedded.coffee | #D08442 | — |
| meta.property-group support.constant.property-value.css, meta.property-value support.constant.property-value.css | #896ef4 | |
| variable.language.ruby | #D0B344 | |
| markup.deleted | #dc322f | |
| markup.changed | #cb4b16 | |
| markup.inserted | #219186 | — |
| markup.quote | #9872A2 | — |
| markup.list | #d1e260 | — |
| markup.bold, markup.italic | #6089B4 | — |
| markup.inline.raw | #FF0080 | |
| token.info-token | #6796e6 | — |
| token.warn-token | #cd9731 | — |
| token.error-token | #f44747 | — |
| token.debug-token | #b267e6 | — |
| markup.heading | #D0B344 | — |
| markup.heading.setext | #D0B344 | |
| meta.diff, meta.diff.header | #E0EDDD | — |
| variable.language.js | #CC555A | — |
| support.type.property-name.css | #FFF9B9 | |
| meta.selector.css entity.other.attribute-name.id | #cca789 | |
| punctuation.definition.tag.html, punctuation.definition.tag.begin, punctuation.definition.tag.end | #fff9b8 | — |
| invalid | #FF0B00 | |
| string.quoted.double.html, punctuation.definition.string.begin.html, punctuation.definition.string.end.html | #ACDBFF | |
| punctuation.terminator.statement.js.jsx, punctuation.separator.comma.js.jsx | #D90046 | — |
| punctuation.separator | #D0D0D0 | — |
| string.regexp, string.regexp keyword.control, string.regexp keyword.operator | #69f0ae | — |
| string.regexp punctuation.definition.string | #A9B9B0 | — |
| string.regexp keyword.other | #ff8f3b | — |
| entity.name.function | #88dcf6 | — |
| punctuation.definition.parameters, punctuation.definition.arguments | #C9E9E0 | — |
| meta.parameters, variable.other.readwrite.js.jsx | #ff8f3b | — |
| variable.parameter | #ff8f3b | — |
| variable.function, meta.function-call entity.name.function, meta.method-call entity.name.function | #88dcf6 | — |
| entity.name.type.class, entity.other.inherited-class, support.class | #c2f8cb | — |
| meta.tag.sgml, meta.tag.sgml variable.language, meta.tag.sgml punctuation.definition.tag | #ffb732 | — |
| meta.tag.preprocessor, meta.tag.preprocessor entity.name.tag, meta.tag.preprocessor punctuation.definition.tag | #FFCC32 | — |
| entity.name.tag | #FF3D7E | — |
| punctuation.definition.tag | #D0D0D0 | — |
| entity.other.attribute-name | #ffc19a | — |
| meta.tag.metadata.script entity.name.tag, meta.tag.metadata.script punctuation.definition.tag | #3be3b1 | — |
| support.type.property-name | #FFC19A | — |
| support.type.property-name.json | #FFC19B | — |
| meta.property-value | #69f0ae | — |
| punctuation.section | #D0D0D0 | — |
| variable.css, variable.scss | #69F0AE | — |
| punctuation.definition.entity, punctuation.definition.attribute-selector | #8CDAFF | — |
| Attribute Selector String Value | #69f0ae | — |
| keyword.control.at-rule, keyword.control.at-rule punctuation | #69f0ae | — |
| meta.at-rule support.function | #8CDAFF | — |
| meta.at-rule.mixin variable.scss, meta.at-rule.function variable.scss | #D0D0D0 | — |
| meta.at-rule.mixin support.constant, meta.at-rule.mixin variable.parameter, meta.at-rule.function support.constant, meta.at-rule.function variable.parameter | #69f0ae | — |
| meta.at-rule.mixin constant.numeric, meta.at-rule.function constant.numeric | — | — |
| keyword.control.at-rule.include, keyword.control.at-rule.include punctuation | #ff8f3b | — |
| meta.at-rule.function punctuation.section | #C9E9E0 | — |
| meta.at-rule.return | #D0D0D0 | — |
| meta.at-rule.return punctuation.definition.begin.bracket, meta.at-rule.return punctuation.definition.end.bracket | #D0D0D0 | — |
| meta.at-rule.include entity.name.function, meta.at-rule.include punctuation, meta.property-value punctuation.section.function | #C9E9E0 | — |
| punctuation.definition.interpolation | #FF3D7E | — |
| punctuation.definition.map | #FF3D7E | — |
| comment storage.type, comment punctuation.definition.block | #747DC3 | normal |
| punctuation.definition.block, punctuation.definition.dictionary | #A9B9B0 | — |
| meta.brace.square, punctuation.definition.array | #ff9c75 | — |
| meta.brace.round | #ebfff2 | — |
| meta.embedded, source.groovy.embedded | #ebfff2 | — |
| string source | #D08442 | |
| punctuation.accessor | #ff8e38 | — |
| support.variable.dom, support.class.console, support.type.object | #ff3b7c | — |
| support.variable.property.js | #0ebb9f | — |
| support.class.js, support.class.builtin.js | #8CDAFF | — |
| meta.function-call support.class.builtin.js, new.expr entity.name.type.js | #C9E9E0 | — |
| support.class.js | #F8F8F2 | — |
| string.template.js, punctuation.definition.string.template | #69f0ae | — |
| meta.template.expression | #F8F8F2 | — |
| punctuation.definition.template-expression | #FF3D7E | — |
| punctuation.support.type.property-name | #ff8f3b | — |
| punctuation.section.embedded | #A9B9B0 | — |
| punctuation.definition.begin.bracket.round, punctuation.definition.end.bracket.round | #C9E9E0 | — |
| variable.other.php | #F8F8F2 | — |
| meta.function.parameter | #D0D0D0 | — |
| punctuation.section.array | #D77676 | — |
| keyword.other.new | #ff8f3b | — |
| keyword.other.sql, keyword.other.DML.sql, keyword.other.alias.sql | #ff8f3b | — |
| keyword.other.DDL.create.II.sql | #D77676 | — |
| entity.name.section, punctuation.definition.heading | #FFE082 | — |
| markup beginning.punctuation | #ff8f3b | — |
| markup punctuation | #B2B2B1 | — |
| string.other.link | #C9E9E0 | — |
| markup.underline.link | #606c75 | — |
| string.other.link.description.title | #D0D0D0 | — |
| meta.link punctuation | #B2B2B1 | — |
| meta.image punctuation | #B2B2B1 | — |
| markup.fenced_code punctuation | #bef8c7 | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...