Neon Cyberpunk
Publisher: Aiyu AyaanThemes in package: 1
A vibrant cyberpunk theme with neon colors for VSCode.
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#1e3a5f
- activityBar.activeBorder#22d3ee
- activityBar.background#0a1929
- activityBar.border#1e293b
- activityBar.foreground#22d3ee
- activityBar.inactiveForeground#0891b2
- activityBarBadge.background#ec4899
- activityBarBadge.foreground#ffffff
- breadcrumb.activeSelectionForeground#c084fc
- breadcrumb.background#0a1929
- breadcrumb.focusForeground#ffffff
- breadcrumb.foreground#6b7280
- button.background#ec4899
- button.foreground#ffffff
- button.hoverBackground#f472b6
- button.secondaryBackground#4c1d95
- button.secondaryForeground#e9d5ff
- dropdown.background#1e1433
- dropdown.border#4c1d95
- dropdown.foreground#e9d5ff
- editor.background#0d1117
- editor.findMatchBackground#ec489960
- editor.findMatchHighlightBackground#ec489940
- editor.foreground#e5e7eb
- editor.hoverHighlightBackground#7c3aed25
- editor.lineHighlightBackground#22d3ee15
- editor.rangeHighlightBackground#22d3ee20
- editor.selectionBackground#ec489950
- editor.selectionHighlightBackground#ec489930
- editor.wordHighlightBackground#22d3ee25
- editor.wordHighlightStrongBackground#22d3ee40
- editorBracketMatch.background#7c3aed30
- editorBracketMatch.border#c084fc
- editorCursor.foreground#ff0080
- editorError.foreground#f87171
- editorGroup.border#374151
- editorGroupHeader.tabsBackground#0a1929
- editorGroupHeader.tabsBorder#1e293b
- editorIndentGuide.activeBackground1#8b5cf6
- editorIndentGuide.background1#374151
- editorInfo.foreground#22d3ee
- editorLineNumber.activeForeground#a78bfa
- editorLineNumber.foreground#4b5563
- editorRuler.foreground#374151
- editorWarning.foreground#fbbf24
- extensionButton.prominentBackground#ec4899
- extensionButton.prominentForeground#ffffff
- extensionButton.prominentHoverBackground#f472b6
- gitDecoration.addedResourceForeground#22d3ee
- gitDecoration.deletedResourceForeground#f87171
- gitDecoration.ignoredResourceForeground#6b7280
- gitDecoration.modifiedResourceForeground#fbbf24
- gitDecoration.untrackedResourceForeground#34d399
- input.background#1e1433
- input.border#a78bfa
- input.foreground#e9d5ff
- input.placeholderForeground#64748b
- inputOption.activeBorder#c084fc
- inputValidation.errorBackground#7f1d1d
- inputValidation.errorBorder#f87171
- inputValidation.warningBackground#78350f
- inputValidation.warningBorder#fbbf24
- list.activeSelectionBackground#7c3aed
- list.activeSelectionForeground#ffffff
- list.focusBackground#4c1d9560
- list.highlightForeground#22d3ee
- list.hoverBackground#1e3a5f60
- list.inactiveSelectionBackground#1e3a5f
- list.inactiveSelectionForeground#e9d5ff
- menu.background#1a0f2e
- menu.border#4c1d95
- menu.foreground#e9d5ff
- menu.selectionBackground#7c3aed
- menu.selectionForeground#ffffff
- menu.separatorBackground#8b5cf6
- menubar.selectionBackground#4c1d95
- menubar.selectionForeground#c084fc
- minimap.background#0a1929
- minimap.findMatchHighlight#ec4899
- minimap.selectionHighlight#c084fc
- notificationCenter.border#4c1d95
- notifications.background#1e1433
- notifications.border#4c1d95
- notifications.foreground#ffffff
- notificationToast.border#4c1d95
- panel.background#0a1929
- panel.border#1e293b
- panelInput.border#4c1d95
- panelTitle.activeForeground#22d3ee
- panelTitle.inactiveForeground#64748b
- progressBar.background#ec4899
- quickInput.background#1e1433
- quickInput.foreground#e9d5ff
- quickInputList.focusBackground#4c1d95
- scrollbar.shadow#00000050
- scrollbarSlider.activeBackground#8b5cf6
- scrollbarSlider.background#47556950
- scrollbarSlider.hoverBackground#47556980
- search.resultsInfoForeground#cbd5e1
- searchEditor.findMatchBackground#ec489960
- searchEditor.textInputBorder#4c1d95
- sideBar.background#080a0e
- sideBar.border#1e293b
- sideBar.foreground#cbd5e1
- sideBarSectionHeader.background#1a1f2e
- sideBarSectionHeader.border#374151
- sideBarSectionHeader.foreground#a78bfa
- sideBarTitle.foreground#c084fc
- statusBar.background#1a0f2e
- statusBar.border#4c1d95
- statusBar.foreground#e9d5ff
- statusBarItem.activeBackground#4c1d95
- statusBarItem.prominentBackground#ec4899
- statusBarItem.prominentForeground#ffffff
- tab.activeBackground#4c1d95
- tab.activeBorderTop#00ffff
- tab.activeForeground#ffffff
- tab.hoverBackground#1e3a5f
- tab.inactiveBackground#161b22
- tab.inactiveForeground#94a3b8
- terminal.ansiBlue#60a5fa
- terminal.ansiBrightGreen#6ee7b7
- terminal.ansiCyan#22d3ee
- terminal.ansiGreen#34d399
- terminal.ansiMagenta#c084fc
- terminal.ansiRed#f87171
- terminal.ansiYellow#fbbf24
- terminal.background#0d1117
- terminal.foreground#22d3ee
- terminal.selectionBackground#7c3aed40
- titleBar.activeBackground#1a0f2e
- titleBar.activeForeground#ffffff
- titleBar.border#c084fc
- titleBar.inactiveBackground#0f0a1a
- titleBar.inactiveForeground#64748b
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #a78bfa | italic |
| keyword, storage.type, storage.modifier | #d946ef | bold |
| keyword.control, keyword.operator.new, keyword.other.important | #ff0080 | bold |
| entity.name.function, support.function, meta.function-call | #00ffff | bold |
| entity.name.type, entity.name.class, support.class, entity.other.inherited-class | #c084fc | bold |
| string, string.quoted | #00ff88 | — |
| string.template, meta.template.expression, punctuation.definition.template-expression | #22d3ee | bold |
| constant.numeric, constant.language.boolean, constant.language.null | #ff9500 | — |
| variable, variable.other.readwrite, variable.parameter | #a5f3fc | — |
| variable.other.property, variable.other.object.property, support.type.property-name | #38bdf8 | — |
| variable.other.constant, constant.language, constant.character | #fb7185 | — |
| keyword.operator, keyword.operator.arithmetic, keyword.operator.logical | #a855f7 | — |
| punctuation, meta.brace, punctuation.separator | #fde047 | — |
| entity.name.tag, meta.tag | #ff006e | bold |
| entity.other.attribute-name | #06b6d4 | italic |
| entity.name.tag.css, entity.other.attribute-name.class.css, entity.other.attribute-name.id.css | #8b5cf6 | bold |
| support.type.property-name.css | #3b82f6 | — |
| support.constant.property-value.css, meta.property-value.css | #84cc16 | — |
| keyword.control.import, keyword.control.export, keyword.control.from | #f472b6 | bold |
| variable.language.this, variable.language.self | #ff8800 | italic bold |
| entity.name.function.decorator, meta.decorator | #fbbf24 | bold |
| string.regexp | #a3e635 | bold |
| constant.character.escape | #ffff00 | bold |
| support.type.property-name.json | #22d3ee | bold |
| markup.heading.1 | #ff0080 | bold |
| markup.heading.2 | #d946ef | bold |
| markup.heading.3 | #c084fc | bold |
| markup.heading.4, markup.heading.5, markup.heading.6 | #a78bfa | bold |
| markup.bold | #ff006e | bold |
| markup.italic | #2dd4bf | italic |
| markup.inline.raw, markup.fenced_code | #00ff88 | — |
| markup.underline.link | #0ea5e9 | — |
| markup.quote | #a855f7 | italic |
| entity.name.type.interface | #14b8a6 | bold |
| entity.name.type.enum | #f59e0b | bold |
| entity.name.namespace, entity.name.type.module | #6366f1 | bold |
| support.constant | #facc15 | — |
| meta.tag.metadata, entity.name.tag.metadata | #84cc16 | — |
| invalid, invalid.deprecated | #ff3333 | bold strikethrough |
| keyword.other.DML.sql | #06b6d4 | bold |
| entity.name.function.decorator.python, meta.function.decorator.python | #fbbf24 | bold |
| meta.type.annotation, storage.type.annotation | #38bdf8 | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...