Cyber Dark & Qoder Themes
Publisher: tryToDEvThemes in package: 8
A modern VSCode theme collection featuring Cyber Dark variants and modern purple/blue accent themes with clean, minimalistic design
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#05080C
- activityBar.border#1F2937
- activityBar.foreground#E5E7EB
- activityBar.inactiveForeground#6B7280
- activityBarBadge.background#00F0FF
- activityBarBadge.foreground#0A0E14
- breadcrumb.activeSelectionForeground#00F0FF
- breadcrumb.background#0A0E14
- breadcrumb.focusForeground#E5E7EB
- breadcrumb.foreground#6B7280
- button.background#1F2937
- button.foreground#E5E7EB
- button.hoverBackground#374151
- button.secondaryBackground#1F2937
- button.secondaryForeground#E5E7EB
- button.secondaryHoverBackground#374151
- checkbox.background#1F2937
- checkbox.border#1F2937
- checkbox.foreground#E5E7EB
- contrastActiveBorder#00F0FF
- contrastBorder#00F0FF
- debugExceptionWidget.background#121820
- debugExceptionWidget.border#1F2937
- debugToolBar.background#121820
- debugToolBar.border#1F2937
- descriptionForeground#6B7280
- diffEditor.insertedTextBackground#0A3D2A
- diffEditor.insertedTextBorder#00FF9D
- diffEditor.removedTextBackground#3D0A0A
- diffEditor.removedTextBorder#FF6B00
- dropdown.background#121820
- dropdown.border#1F2937
- dropdown.foreground#E5E7EB
- editor.background#0A0E14
- editor.findMatchBackground#1E3A5F
- editor.findMatchHighlightBackground#1F2937
- editor.foreground#E5E7EB
- editor.inactiveSelectionBackground#121820
- editor.lineHighlightBackground#121820
- editor.selectionBackground#1E3A5F
- editor.selectionHighlightBackground#1E3A5F
- editorBracketMatch.background#1E3A5F
- editorBracketMatch.border#00F0FF
- editorCursor.foreground#00F0FF
- editorGhostText.foreground#6B7280
- editorGroup.background#0A0E14
- editorGroup.border#1F2937
- editorGroupHeader.tabsBackground#0A0E14
- editorGroupHeader.tabsBorder#1F2937
- editorHoverWidget.background#121820
- editorHoverWidget.border#1F2937
- editorIndentGuide.activeBackground#374151
- editorIndentGuide.background#1F2937
- editorLineNumber.activeForeground#E5E7EB
- editorLineNumber.foreground#6B7280
- editorOverviewRuler.border#1F2937
- editorOverviewRuler.bracketMatchForeground#00F0FF
- editorOverviewRuler.errorForeground#FF6B00
- editorOverviewRuler.findMatchForeground#FF6B00
- editorOverviewRuler.infoForeground#3B82F6
- editorOverviewRuler.rangeHighlightForeground#1E3A5F
- editorOverviewRuler.selectionHighlightForeground#1E3A5F
- editorOverviewRuler.warningForeground#FFFF00
- editorSuggestWidget.background#121820
- editorSuggestWidget.border#1F2937
- editorSuggestWidget.highlightForeground#00F0FF
- editorSuggestWidget.selectedBackground#1E3A5F
- editorUnicodeHighlight.background#1E3A5F
- editorUnicodeHighlight.border#1F2937
- editorWhitespace.foreground#374151
- errorBackground#3D0A0A
- errorForeground#FF6B00
- explorerFolderIcon.color#00F0FF
- extensionButton.prominentBackground#00F0FF
- extensionButton.prominentForeground#0A0E14
- extensionButton.prominentHoverBackground#33F0FF
- focusBorder#00F0FF
- gitDecoration.addedResourceForeground#00FF9D
- gitDecoration.conflictedResourceForeground#FF6B00
- gitDecoration.deletedResourceForeground#FF6B00
- gitDecoration.ignoredResourceForeground#6B7280
- gitDecoration.modifiedResourceForeground#3B82F6
- gitDecoration.untrackedResourceForeground#FFFF00
- infoBackground#0A2A3D
- infoForeground#3B82F6
- input.background#0A0E14
- input.border#1F2937
- input.foreground#E5E7EB
- input.placeholderForeground#6B7280
- inputValidation.errorBackground#3D0A0A
- inputValidation.errorBorder#FF6B00
- inputValidation.errorForeground#FF6B00
- inputValidation.infoBackground#0A2A3D
- inputValidation.infoBorder#3B82F6
- inputValidation.infoForeground#3B82F6
- inputValidation.warningBackground#3D2A0A
- inputValidation.warningBorder#FFFF00
- inputValidation.warningForeground#FFFF00
- list.activeSelectionBackground#1E3A5F
- list.activeSelectionForeground#E5E7EB
- list.deemphasizedForeground#6B7280
- list.errorForeground#FF6B00
- list.focusBackground#1E3A5F
- list.focusForeground#E5E7EB
- list.highlightForeground#00F0FF
- list.hoverBackground#121820
- list.inactiveFocusBackground#121820
- list.inactiveFocusForeground#E5E7EB
- list.inactiveSelectionBackground#121820
- list.inactiveSelectionForeground#E5E7EB
- list.warningForeground#FFFF00
- menu.background#121820
- menu.border#1F2937
- menu.foreground#E5E7EB
- menu.selectionBackground#1E3A5F
- menu.selectionForeground#E5E7EB
- menu.separatorBackground#1F2937
- notificationCenter.background#121820
- notificationCenter.border#1F2937
- notifications.background#121820
- notifications.border#1F2937
- notifications.foreground#E5E7EB
- notificationsErrorIcon.foreground#FF6B00
- notificationsInfoIcon.foreground#3B82F6
- notificationsWarningIcon.foreground#FFFF00
- notificationToast.border#1F2937
- panel.background#05080C
- panel.border#1F2937
- panel.dropBackground#1E3A5F40
- panelSection.border#1F2937
- panelSection.dropBackground#1E3A5F40
- panelSectionHeader.background#0A0E14
- panelSectionHeader.border#1F2937
- panelSectionHeader.foreground#E5E7EB
- panelTitle.activeBorder#00F0FF
- panelTitle.activeForeground#E5E7EB
- panelTitle.inactiveForeground#6B7280
- pickerGroup.border#1F2937
- pickerGroup.foreground#6B7280
- progressBar.background#00F0FF
- scrollbarSlider.activeBackground#00F0FF
- scrollbarSlider.background#1F2937
- scrollbarSlider.hoverBackground#374151
- sideBar.background#0A0E14
- sideBar.border#1F2937
- sideBar.foreground#E5E7EB
- sideBarSectionHeader.background#0A0E14
- sideBarSectionHeader.foreground#6B7280
- sideBarTitle.foreground#E5E7EB
- statusBar.background#0A0E14
- statusBar.border#1F2937
- statusBar.debuggingBackground#0A0E14
- statusBar.debuggingForeground#FF6B00
- statusBar.foreground#E5E7EB
- statusBar.noFolderBackground#0A0E14
- symbolIcon.arrayForeground#3B82F6
- symbolIcon.booleanForeground#FF6B00
- symbolIcon.classForeground#FFFF00
- symbolIcon.colorForeground#FF00FF
- symbolIcon.constantForeground#FFFF00
- symbolIcon.constructorForeground#FF00FF
- symbolIcon.enumeratorForeground#FFFF00
- symbolIcon.enumeratorMemberForeground#3B82F6
- symbolIcon.eventForeground#FFFF00
- symbolIcon.fieldForeground#3B82F6
- symbolIcon.fileForeground#E5E7EB
- symbolIcon.folderForeground#00F0FF
- symbolIcon.functionForeground#FF00FF
- symbolIcon.interfaceForeground#FFFF00
- symbolIcon.keyForeground#3B82F6
- symbolIcon.keywordForeground#00F0FF
- symbolIcon.methodForeground#FF00FF
- symbolIcon.moduleForeground#00F0FF
- symbolIcon.namespaceForeground#FFFF00
- symbolIcon.nullForeground#6B7280
- symbolIcon.numberForeground#FF6B00
- symbolIcon.objectForeground#3B82F6
- symbolIcon.operatorForeground#00F0FF
- symbolIcon.packageForeground#00F0FF
- symbolIcon.propertyForeground#3B82F6
- symbolIcon.referenceForeground#3B82F6
- symbolIcon.snippetForeground#FF00FF
- symbolIcon.stringForeground#00FF9D
- symbolIcon.structForeground#FFFF00
- symbolIcon.textForeground#E5E7EB
- symbolIcon.typeParameterForeground#3B82F6
- symbolIcon.unitForeground#FFFF00
- symbolIcon.variableForeground#3B82F6
- tab.activeBackground#0A0E14
- tab.activeBorder#00F0FF
- tab.activeForeground#E5E7EB
- tab.inactiveBackground#0A0E14
- tab.inactiveBorder#1F2937
- tab.inactiveForeground#6B7280
- terminal.ansiBlack#0A0E14
- terminal.ansiBlue#00F0FF
- terminal.ansiBrightBlack#6B7280
- terminal.ansiBrightBlue#33F0FF
- terminal.ansiBrightCyan#5C9CFF
- terminal.ansiBrightGreen#5CFFD1
- terminal.ansiBrightMagenta#FF33FF
- terminal.ansiBrightRed#FF8C42
- terminal.ansiBrightWhite#FFFFFF
- terminal.ansiBrightYellow#FFFF33
- terminal.ansiCyan#3B82F6
- terminal.ansiGreen#00FF9D
- terminal.ansiMagenta#FF00FF
- terminal.ansiRed#FF6B00
- terminal.ansiWhite#E5E7EB
- terminal.ansiYellow#FFFF00
- terminal.background#05080C
- terminal.border#1F2937
- terminal.foreground#E5E7EB
- terminal.selectionBackground#1E3A5F80
- terminalCursor.background#00F0FF
- terminalCursor.foreground#05080C
- textBlockQuote.background#121820
- textBlockQuote.border#1F2937
- textCodeBlock.background#121820
- textLink.activeForeground#33F0FF
- textLink.foreground#00F0FF
- textPreformat.foreground#FF00FF
- titleBar.activeBackground#0A0E14
- titleBar.activeForeground#E5E7EB
- titleBar.border#1F2937
- titleBar.inactiveBackground#0A0E14
- titleBar.inactiveForeground#6B7280
- walkthrough.stepActive.foreground#00F0FF
- walkthrough.stepDescription.foreground#6B7280
- walkthrough.stepTitle.foreground#E5E7EB
- warningBackground#3D2A0A
- warningForeground#FFFF00
- welcomePage.background#0A0E14
- welcomePage.buttonBackground#1F2937
- welcomePage.buttonHoverBackground#374151
- widget.shadow#05080C
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #6B7280 | italic |
| keyword, storage.type, storage.modifier | #00F0FF | — |
| keyword.control, keyword.control.conditional, keyword.control.loop, keyword.control.flow | #00F0FF | bold |
| keyword.control.flow.js, keyword.control.flow.ts, keyword.control.conditional.js, keyword.control.conditional.ts, keyword.control.loop.js, keyword.control.loop.ts | #00F0FF | bold |
| keyword.control.async.js, keyword.control.async.ts, storage.modifier.async.js, storage.modifier.async.ts | #00F0FF | bold |
| entity.name.function, support.function, meta.function-call | #FF00FF | — |
| meta.method, meta.method-call, entity.name.method | #FF00FF | — |
| storage.type.function.arrow.js, storage.type.function.arrow.ts, keyword.operator.arrow.js, keyword.operator.arrow.ts | #FF00FF | — |
| entity.name.class, entity.name.type.class, support.class, storage.type.class.js, storage.type.class.ts | #A855F7 | — |
| entity.name.type, support.type, storage.type | #A855F7 | — |
| entity.name.interface, entity.name.type.interface | #A855F7 | — |
| variable, variable.other, variable.other.readwrite | #3B82F6 | — |
| variable.language.this.js, variable.language.this.ts, variable.language.super.js, variable.language.super.ts | #FFFF00 | bold |
| variable.other.constant, constant, constant.language, constant.numeric | #FFFF00 | — |
| string, string.quoted, string.template | #00FF9D | — |
| string.template.js, string.template.ts | #00FF9D | — |
| constant.numeric, constant.numeric.integer, constant.numeric.float | #FF6B00 | — |
| constant.language.boolean, constant.language.true, constant.language.false | #FF6B00 | bold |
| constant.language.null, constant.language.undefined, constant.language.nan | #FF6B00 | italic |
| variable.other.property, meta.property-name, support.variable.property | #3B82F6 | — |
| keyword.operator, punctuation.separator.key-value, punctuation.accessor | #00F0FF | — |
| keyword.operator.spread.js, keyword.operator.spread.ts, keyword.operator.rest.js, keyword.operator.rest.ts | #FF00FF | bold |
| punctuation, punctuation.definition, punctuation.separator, punctuation.terminator | #E5E7EB | — |
| entity.name.tag, meta.tag, punctuation.definition.tag | #00F0FF | — |
| entity.name.tag.js, entity.name.tag.tsx, entity.name.tag.jsx, support.class.component.js, support.class.component.tsx, meta.tag.js, meta.tag.tsx | #00F0FF | — |
| entity.other.attribute-name, meta.attribute-name | #3B82F6 | — |
| entity.other.attribute-name.js, entity.other.attribute-name.tsx, entity.other.attribute-name.jsx | #3B82F6 | — |
| string.quoted.double, string.quoted.single | #00FF9D | — |
| meta.decorator, entity.name.decorator | #FF00FF | — |
| variable.parameter, variable.parameter.function | #3B82F6 | — |
| entity.name.label | #FFFF00 | — |
| entity.name.namespace, support.namespace | #FFFF00 | — |
| entity.name.enum, entity.name.type.enum | #FFFF00 | — |
| variable.other.enummember, constant.other.enum | #3B82F6 | — |
| entity.name.function.constructor, support.function.constructor | #FF00FF | — |
| entity.name.module, support.module | #00F0FF | — |
| keyword.control.import.js, keyword.control.import.ts, keyword.control.export.js, keyword.control.export.ts, keyword.control.from.js, keyword.control.from.ts | #00F0FF | bold |
| string.regexp | #FF00FF | — |
| constant.character.escape | #FFFF00 | — |
| invalid, invalid.illegal | #FF6B00 | underline |
| invalid.deprecated | #6B7280 | strikethrough |
| markup.heading, markup.heading entity.name, markup.heading.markdown | #00F0FF | bold |
| markup.bold, punctuation.definition.bold | #E5E7EB | bold |
| markup.italic, punctuation.definition.italic | #E5E7EB | italic |
| markup.underline.link, string.other.link | #00F0FF | underline |
| markup.raw, markup.raw.block | #00FF9D | — |
| markup.list, punctuation.definition.list | #FFFF00 | — |
| markup.quote | #6B7280 | italic |
| entity.other.attribute-name.class, entity.other.attribute-name.id, entity.other.attribute-name.tag | #00F0FF | — |
| support.type.property-name, support.property-name | #3B82F6 | — |
| support.constant.property-value, constant.other.color | #00FF9D | — |
| support.type.property-name.json, meta.key.json | #3B82F6 | — |
| meta.value.json string.quoted.double.json | #00FF9D | — |
| entity.name.tag.yaml | #3B82F6 | — |
| string.unquoted.yaml | #00FF9D | — |
| support.function.python, entity.name.function.python | #FF00FF | — |
| meta.decorator.python, entity.name.decorator.python | #FF00FF | — |
| variable.language.self.python, variable.language.cls.python | #FFFF00 | — |
| storage.type.annotation.java, meta.annotation.java | #FF00FF | — |
| entity.name.function.go, support.function.go | #FF00FF | — |
| entity.name.function.macro.rust, meta.macro.rust | #FF00FF | — |
| storage.modifier.lifetime.rust, entity.name.lifetime.rust | #FFFF00 | — |
| entity.name.function.shell, support.function.builtin.shell | #FF00FF | bold |
| variable.other.shell, variable.other.readwrite.shell | #3B82F6 | — |
| string.quoted.shell, string.unquoted.shell | #00FF9D | — |
| variable.parameter.shell | #FFFF00 | — |
| markup.inserted.shell, string.success.shell | #00FF9D | bold |
| markup.changed.shell, string.warning.shell | #FFFF00 | bold |
| markup.deleted.shell, string.error.shell | #FF6B00 | bold |