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#080A0C
- activityBar.border#2C3E50
- activityBar.foreground#E8E8E8
- activityBar.inactiveForeground#8B949E
- activityBarBadge.background#FF6B6B
- activityBarBadge.foreground#0D0F12
- breadcrumb.activeSelectionForeground#FF6B6B
- breadcrumb.background#0D0F12
- breadcrumb.focusForeground#E8E8E8
- breadcrumb.foreground#8B949E
- button.background#1E272E
- button.foreground#E8E8E8
- button.hoverBackground#2C3E50
- button.secondaryBackground#1E272E
- button.secondaryForeground#E8E8E8
- button.secondaryHoverBackground#2C3E50
- checkbox.background#1E272E
- checkbox.border#2C3E50
- checkbox.foreground#E8E8E8
- contrastActiveBorder#FF6B6B
- contrastBorder#FF6B6B
- debugExceptionWidget.background#14171C
- debugExceptionWidget.border#2C3E50
- debugToolBar.background#14171C
- debugToolBar.border#2C3E50
- descriptionForeground#8B949E
- diffEditor.insertedTextBackground#1A3D2A
- diffEditor.insertedTextBorder#6BCB77
- diffEditor.removedTextBackground#3D1A2A
- diffEditor.removedTextBorder#FF6B9D
- dropdown.background#14171C
- dropdown.border#2C3E50
- dropdown.foreground#E8E8E8
- editor.background#0D0F12
- editor.findMatchBackground#2C3E50
- editor.findMatchHighlightBackground#1E272E
- editor.foreground#E8E8E8
- editor.inactiveSelectionBackground#14171C
- editor.lineHighlightBackground#14171C
- editor.selectionBackground#2C3E50
- editor.selectionHighlightBackground#2C3E50
- editorBracketMatch.background#2C3E50
- editorBracketMatch.border#FF6B6B
- editorCursor.foreground#FF6B6B
- editorGhostText.foreground#8B949E
- editorGroup.background#0D0F12
- editorGroup.border#2C3E50
- editorGroupHeader.tabsBackground#0D0F12
- editorGroupHeader.tabsBorder#2C3E50
- editorHoverWidget.background#14171C
- editorHoverWidget.border#2C3E50
- editorIndentGuide.activeBackground#2C3E50
- editorIndentGuide.background#1E272E
- editorLineNumber.activeForeground#E8E8E8
- editorLineNumber.foreground#8B949E
- editorOverviewRuler.border#2C3E50
- editorOverviewRuler.bracketMatchForeground#FF6B6B
- editorOverviewRuler.errorForeground#FF6B9D
- editorOverviewRuler.findMatchForeground#FF6B9D
- editorOverviewRuler.infoForeground#74B9FF
- editorOverviewRuler.rangeHighlightForeground#2C3E50
- editorOverviewRuler.selectionHighlightForeground#2C3E50
- editorOverviewRuler.warningForeground#FFEAA7
- editorSuggestWidget.background#14171C
- editorSuggestWidget.border#2C3E50
- editorSuggestWidget.highlightForeground#FF6B6B
- editorSuggestWidget.selectedBackground#2C3E50
- editorUnicodeHighlight.background#2C3E50
- editorUnicodeHighlight.border#2C3E50
- editorWhitespace.foreground#2C3E50
- errorBackground#3D1A2A
- errorForeground#FF6B9D
- explorerFolderIcon.color#FF6B6B
- extensionButton.prominentBackground#FF6B6B
- extensionButton.prominentForeground#0D0F12
- extensionButton.prominentHoverBackground#FF8C8C
- focusBorder#FF6B6B
- gitDecoration.addedResourceForeground#6BCB77
- gitDecoration.conflictedResourceForeground#FF6B9D
- gitDecoration.deletedResourceForeground#FF6B9D
- gitDecoration.ignoredResourceForeground#8B949E
- gitDecoration.modifiedResourceForeground#74B9FF
- gitDecoration.untrackedResourceForeground#FFEAA7
- infoBackground#1A2A3D
- infoForeground#74B9FF
- input.background#0D0F12
- input.border#2C3E50
- input.foreground#E8E8E8
- input.placeholderForeground#8B949E
- inputValidation.errorBackground#3D1A2A
- inputValidation.errorBorder#FF6B9D
- inputValidation.errorForeground#FF6B9D
- inputValidation.infoBackground#1A2A3D
- inputValidation.infoBorder#74B9FF
- inputValidation.infoForeground#74B9FF
- inputValidation.warningBackground#3D2A1A
- inputValidation.warningBorder#FFEAA7
- inputValidation.warningForeground#FFEAA7
- list.activeSelectionBackground#2C3E50
- list.activeSelectionForeground#E8E8E8
- list.deemphasizedForeground#8B949E
- list.errorForeground#FF6B9D
- list.focusBackground#2C3E50
- list.focusForeground#E8E8E8
- list.highlightForeground#FF6B6B
- list.hoverBackground#14171C
- list.inactiveFocusBackground#14171C
- list.inactiveFocusForeground#E8E8E8
- list.inactiveSelectionBackground#14171C
- list.inactiveSelectionForeground#E8E8E8
- list.warningForeground#FFEAA7
- menu.background#14171C
- menu.border#2C3E50
- menu.foreground#E8E8E8
- menu.selectionBackground#2C3E50
- menu.selectionForeground#E8E8E8
- menu.separatorBackground#2C3E50
- notificationCenter.background#14171C
- notificationCenter.border#2C3E50
- notifications.background#14171C
- notifications.border#2C3E50
- notifications.foreground#E8E8E8
- notificationsErrorIcon.foreground#FF6B9D
- notificationsInfoIcon.foreground#74B9FF
- notificationsWarningIcon.foreground#FFEAA7
- notificationToast.border#2C3E50
- panel.background#080A0C
- panel.border#2C3E50
- panel.dropBackground#2C3E5040
- panelSection.border#2C3E50
- panelSection.dropBackground#2C3E5040
- panelSectionHeader.background#0D0F12
- panelSectionHeader.border#2C3E50
- panelSectionHeader.foreground#E8E8E8
- panelTitle.activeBorder#FF6B6B
- panelTitle.activeForeground#E8E8E8
- panelTitle.inactiveForeground#8B949E
- pickerGroup.border#2C3E50
- pickerGroup.foreground#8B949E
- progressBar.background#FF6B6B
- scrollbarSlider.activeBackground#FF6B6B
- scrollbarSlider.background#2C3E50
- scrollbarSlider.hoverBackground#3E4D5F
- sideBar.background#0D0F12
- sideBar.border#2C3E50
- sideBar.foreground#E8E8E8
- sideBarSectionHeader.background#0D0F12
- sideBarSectionHeader.foreground#8B949E
- sideBarTitle.foreground#E8E8E8
- statusBar.background#0D0F12
- statusBar.border#2C3E50
- statusBar.debuggingBackground#0D0F12
- statusBar.debuggingForeground#FF6B9D
- statusBar.foreground#E8E8E8
- statusBar.noFolderBackground#0D0F12
- symbolIcon.arrayForeground#74B9FF
- symbolIcon.booleanForeground#FF6B9D
- symbolIcon.classForeground#FFEAA7
- symbolIcon.colorForeground#FF9F43
- symbolIcon.constantForeground#FFEAA7
- symbolIcon.constructorForeground#FF9F43
- symbolIcon.enumeratorForeground#FFEAA7
- symbolIcon.enumeratorMemberForeground#74B9FF
- symbolIcon.eventForeground#FFEAA7
- symbolIcon.fieldForeground#74B9FF
- symbolIcon.fileForeground#E8E8E8
- symbolIcon.folderForeground#FF6B6B
- symbolIcon.functionForeground#FF9F43
- symbolIcon.interfaceForeground#FFEAA7
- symbolIcon.keyForeground#74B9FF
- symbolIcon.keywordForeground#FF6B6B
- symbolIcon.methodForeground#FF9F43
- symbolIcon.moduleForeground#FF6B6B
- symbolIcon.namespaceForeground#FFEAA7
- symbolIcon.nullForeground#8B949E
- symbolIcon.numberForeground#FF6B9D
- symbolIcon.objectForeground#74B9FF
- symbolIcon.operatorForeground#FF6B6B
- symbolIcon.packageForeground#FF6B6B
- symbolIcon.propertyForeground#74B9FF
- symbolIcon.referenceForeground#74B9FF
- symbolIcon.snippetForeground#FF9F43
- symbolIcon.stringForeground#6BCB77
- symbolIcon.structForeground#FFEAA7
- symbolIcon.textForeground#E8E8E8
- symbolIcon.typeParameterForeground#74B9FF
- symbolIcon.unitForeground#FFEAA7
- symbolIcon.variableForeground#74B9FF
- tab.activeBackground#0D0F12
- tab.activeBorder#FF6B6B
- tab.activeForeground#E8E8E8
- tab.inactiveBackground#0D0F12
- tab.inactiveBorder#2C3E50
- tab.inactiveForeground#8B949E
- terminal.ansiBlack#0D0F12
- terminal.ansiBlue#FF6B6B
- terminal.ansiBrightBlack#8B949E
- terminal.ansiBrightBlue#FF9C9C
- terminal.ansiBrightCyan#9CCBFF
- terminal.ansiBrightGreen#8FD99E
- terminal.ansiBrightMagenta#FFB573
- terminal.ansiBrightRed#FF9CB8
- terminal.ansiBrightWhite#FFFFFF
- terminal.ansiBrightYellow#FFF2C7
- terminal.ansiCyan#74B9FF
- terminal.ansiGreen#6BCB77
- terminal.ansiMagenta#FF9F43
- terminal.ansiRed#FF6B9D
- terminal.ansiWhite#E8E8E8
- terminal.ansiYellow#FFEAA7
- terminal.background#080A0C
- terminal.border#2C3E50
- terminal.foreground#E8E8E8
- terminal.selectionBackground#2C3E5080
- terminalCursor.background#FF6B6B
- terminalCursor.foreground#080A0C
- textBlockQuote.background#14171C
- textBlockQuote.border#2C3E50
- textCodeBlock.background#14171C
- textLink.activeForeground#FF8C8C
- textLink.foreground#FF6B6B
- textPreformat.foreground#FF9F43
- titleBar.activeBackground#0D0F12
- titleBar.activeForeground#E8E8E8
- titleBar.border#2C3E50
- titleBar.inactiveBackground#0D0F12
- titleBar.inactiveForeground#8B949E
- walkthrough.stepActive.foreground#FF6B6B
- walkthrough.stepDescription.foreground#8B949E
- walkthrough.stepTitle.foreground#E8E8E8
- warningBackground#3D2A1A
- warningForeground#FFEAA7
- welcomePage.background#0D0F12
- welcomePage.buttonBackground#1E272E
- welcomePage.buttonHoverBackground#2C3E50
- widget.shadow#080A0C
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #8B949E | italic |
| keyword, storage.type, storage.modifier | #FF6B6B | — |
| keyword.control, keyword.control.conditional, keyword.control.loop, keyword.control.flow | #FF6B6B | 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 | #FF6B6B | bold |
| keyword.control.async.js, keyword.control.async.ts, storage.modifier.async.js, storage.modifier.async.ts | #FF6B6B | bold |
| entity.name.function, support.function, meta.function-call | #FFD93D | — |
| meta.method, meta.method-call, entity.name.method | #FFD93D | — |
| storage.type.function.arrow.js, storage.type.function.arrow.ts, keyword.operator.arrow.js, keyword.operator.arrow.ts | #FFD93D | — |
| entity.name.class, entity.name.type.class, support.class, storage.type.class.js, storage.type.class.ts | #EE5A24 | — |
| entity.name.type, support.type, storage.type | #EE5A24 | — |
| entity.name.interface, entity.name.type.interface | #EE5A24 | — |
| variable, variable.other, variable.other.readwrite | #FF9F43 | — |
| variable.language.this.js, variable.language.this.ts, variable.language.super.js, variable.language.super.ts | #FFEAA7 | bold |
| variable.other.constant, constant, constant.language, constant.numeric | #FFEAA7 | — |
| string, string.quoted, string.template | #6BCB77 | — |
| string.template.js, string.template.ts | #6BCB77 | — |
| constant.numeric, constant.numeric.integer, constant.numeric.float | #FF6B9D | — |
| constant.language.boolean, constant.language.true, constant.language.false | #FF6B9D | bold |
| constant.language.null, constant.language.undefined, constant.language.nan | #FF6B9D | italic |
| variable.other.property, meta.property-name, support.variable.property | #FF9F43 | — |
| keyword.operator, punctuation.separator.key-value, punctuation.accessor | #FF6B6B | — |
| keyword.operator.spread.js, keyword.operator.spread.ts, keyword.operator.rest.js, keyword.operator.rest.ts | #FFD93D | bold |
| punctuation, punctuation.definition, punctuation.separator, punctuation.terminator | #D1D5DB | — |
| entity.name.tag, meta.tag, punctuation.definition.tag | #FF6B6B | — |
| 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 | #FF6B6B | — |
| entity.other.attribute-name, meta.attribute-name | #FF9F43 | — |
| entity.other.attribute-name.js, entity.other.attribute-name.tsx, entity.other.attribute-name.jsx | #FF9F43 | — |
| string.quoted.double, string.quoted.single | #6BCB77 | — |
| meta.decorator, entity.name.decorator | #FFD93D | — |
| variable.parameter, variable.parameter.function | #FF9F43 | — |
| entity.name.label | #FFEAA7 | — |
| entity.name.namespace, support.namespace | #FFEAA7 | — |
| entity.name.enum, entity.name.type.enum | #FFEAA7 | — |
| variable.other.enummember, constant.other.enum | #FF9F43 | — |
| entity.name.function.constructor, support.function.constructor | #FFD93D | — |
| entity.name.module, support.module | #FF6B6B | — |
| keyword.control.import.js, keyword.control.import.ts, keyword.control.export.js, keyword.control.export.ts, keyword.control.from.js, keyword.control.from.ts | #FF6B6B | bold |
| string.regexp | #FFD93D | — |
| constant.character.escape | #FFEAA7 | — |
| invalid, invalid.illegal | #FF6B9D | underline |
| invalid.deprecated | #8B949E | strikethrough |
| markup.heading, markup.heading entity.name, markup.heading.markdown | #FF6B6B | bold |
| markup.bold, punctuation.definition.bold | #E8E8E8 | bold |
| markup.italic, punctuation.definition.italic | #E8E8E8 | italic |
| markup.underline.link, string.other.link | #FF6B6B | underline |
| markup.raw, markup.raw.block | #6BCB77 | — |
| markup.list, punctuation.definition.list | #FFEAA7 | — |
| markup.quote | #8B949E | italic |
| entity.other.attribute-name.class, entity.other.attribute-name.id, entity.other.attribute-name.tag | #FF6B6B | — |
| support.type.property-name, support.property-name | #FF9F43 | — |
| support.constant.property-value, constant.other.color | #6BCB77 | — |
| support.type.property-name.json, meta.key.json | #FF9F43 | — |
| meta.value.json string.quoted.double.json | #6BCB77 | — |
| entity.name.tag.yaml | #FF9F43 | — |
| string.unquoted.yaml | #6BCB77 | — |
| support.function.python, entity.name.function.python | #FFD93D | — |
| meta.decorator.python, entity.name.decorator.python | #FFD93D | — |
| variable.language.self.python, variable.language.cls.python | #FFEAA7 | — |
| storage.type.annotation.java, meta.annotation.java | #FFD93D | — |
| entity.name.function.go, support.function.go | #FFD93D | — |
| entity.name.function.macro.rust, meta.macro.rust | #FFD93D | — |
| storage.modifier.lifetime.rust, entity.name.lifetime.rust | #FFEAA7 | — |
| entity.name.function.shell, support.function.builtin.shell | #FFD93D | bold |
| variable.other.shell, variable.other.readwrite.shell | #FF9F43 | — |
| string.quoted.shell, string.unquoted.shell | #6BCB77 | — |
| variable.parameter.shell | #FFEAA7 | — |
| markup.inserted.shell, string.success.shell | #6BCB77 | bold |
| markup.changed.shell, string.warning.shell | #FFEAA7 | bold |
| markup.deleted.shell, string.error.shell | #FF6B9D | bold |