Skip to main content
Coding Theme

Retronica

Publisher: AdhamThemes in package: 5

A muted 80s-inspired retro theme collection for VS Code — featuring neon nights, amber terminals, phosphor greens, and pastel arcades.

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#f0ebe5
  • activityBar.foreground#5a5060
  • activityBar.inactiveForeground#a098a0
  • activityBarBadge.background#c08090
  • activityBarBadge.foreground#f8f5f0
  • badge.background#c08090
  • badge.foreground#f8f5f0
  • breadcrumb.activeSelectionForeground#3a3545
  • breadcrumb.focusForeground#4a4555
  • breadcrumb.foreground#9a9098
  • breadcrumbPicker.background#f4f0ea
  • button.background#c08090
  • button.foreground#f8f5f0
  • button.hoverBackground#d090a0
  • dropdown.background#ffffff
  • dropdown.border#e0d8d0
  • dropdown.foreground#4a4555
  • editor.background#f8f5f0
  • editor.findMatchBackground#e0c8a0aa
  • editor.findMatchHighlightBackground#e0c8a055
  • editor.foreground#4a4555
  • editor.lineHighlightBackground#f0ebe5
  • editor.selectionBackground#d8c8e0aa
  • editor.selectionHighlightBackground#d8c8e055
  • editor.wordHighlightBackground#d8c8e044
  • editor.wordHighlightStrongBackground#d8c8e066
  • editorBracketMatch.background#d8c8e044
  • editorBracketMatch.border#a08090
  • editorCursor.background#f8f5f0
  • editorCursor.foreground#b06080
  • editorError.foreground#c06060
  • editorGroup.border#e8e0d8
  • editorGroupHeader.tabsBackground#f0ebe5
  • editorGutter.background#f8f5f0
  • editorIndentGuide.activeBackground#d0c0b8
  • editorIndentGuide.background#e8e0d8
  • editorInfo.foreground#5080a0
  • editorLineNumber.activeForeground#7a6070
  • editorLineNumber.foreground#b0a098
  • editorWarning.foreground#b08040
  • editorWhitespace.foreground#e0d8d0
  • gitDecoration.addedResourceForeground#609070
  • gitDecoration.conflictingResourceForeground#a06080
  • gitDecoration.deletedResourceForeground#c06060
  • gitDecoration.ignoredResourceForeground#b0a098
  • gitDecoration.modifiedResourceForeground#b08040
  • gitDecoration.untrackedResourceForeground#508090
  • input.background#ffffff
  • input.border#e0d8d0
  • input.foreground#4a4555
  • input.placeholderForeground#a098a0
  • inputOption.activeBorder#c08090
  • list.activeSelectionBackground#e0d0e0
  • list.activeSelectionForeground#3a3545
  • list.focusBackground#e0d0e0
  • list.highlightForeground#b06080
  • list.hoverBackground#f0ebe5
  • list.inactiveSelectionBackground#e8e0e0
  • minimap.background#f8f5f0
  • minimap.findMatchHighlight#e0c8a055
  • minimap.selectionHighlight#d8c8e055
  • panel.background#f4f0ea
  • panel.border#e8e0d8
  • panelTitle.activeBorder#c08090
  • panelTitle.activeForeground#4a4555
  • panelTitle.inactiveForeground#9a9098
  • peekView.border#a08090
  • peekViewEditor.background#f4f0ea
  • peekViewEditorGutter.background#f8f5f0
  • peekViewResult.background#f0ebe5
  • peekViewTitle.background#f4f0ea
  • progressBar.background#c08090
  • scrollbar.shadow#d0c8c0
  • scrollbarSlider.activeBackground#c8c0b8aa
  • scrollbarSlider.background#c8c0b855
  • scrollbarSlider.hoverBackground#c8c0b888
  • sideBar.background#f4f0ea
  • sideBar.border#e8e0d8
  • sideBar.foreground#6a6070
  • sideBarSectionHeader.background#f0ebe5
  • sideBarSectionHeader.foreground#4a4555
  • sideBarTitle.foreground#4a4555
  • statusBar.background#f0ebe5
  • statusBar.border#e8e0d8
  • statusBar.debuggingBackground#d0a0b0
  • statusBar.debuggingForeground#3a3545
  • statusBar.foreground#6a6070
  • statusBar.noFolderBackground#f8f5f0
  • tab.activeBackground#f8f5f0
  • tab.activeBorder#c08090
  • tab.activeBorderTop#00000000
  • tab.activeForeground#3a3545
  • tab.border#e8e0d8
  • tab.hoverBackground#f4f0ea
  • tab.inactiveBackground#f0ebe5
  • tab.inactiveForeground#9a9098
  • terminal.ansiBlack#4a4555
  • terminal.ansiBlue#5080a0
  • terminal.ansiBrightBlack#7a7080
  • terminal.ansiBrightBlue#6090b0
  • terminal.ansiBrightCyan#6090a0
  • terminal.ansiBrightGreen#70a080
  • terminal.ansiBrightMagenta#b07090
  • terminal.ansiBrightRed#d08080
  • terminal.ansiBrightWhite#f8f5f0
  • terminal.ansiBrightYellow#c09050
  • terminal.ansiCyan#508090
  • terminal.ansiGreen#609070
  • terminal.ansiMagenta#a06080
  • terminal.ansiRed#c06060
  • terminal.ansiWhite#f0ebe5
  • terminal.ansiYellow#b08040
  • terminal.background#f8f5f0
  • terminal.foreground#4a4555
  • terminalCursor.background#f8f5f0
  • terminalCursor.foreground#b06080
  • titleBar.activeBackground#f0ebe5
  • titleBar.activeForeground#4a4555
  • titleBar.inactiveBackground#f4f0ea
  • titleBar.inactiveForeground#9a9098

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#a098a0italic
string, string.quoted, string.template#609070
constant.character.escape#508090
constant.numeric#b07050
constant.language#b07050
constant.other#b07050
keyword, storage.type, storage.modifier#a06080
keyword.control#a06080
keyword.operator#508090
entity.name.function, meta.function-call, support.function#5080a0
entity.name.class, entity.name.type.class, support.class#b08040
entity.name.type, support.type#b08040
variable, variable.other#4a4555
variable.parameter#b07050italic
variable.other.property, variable.other.object.property#c06060
meta.object-literal.key#c06060
entity.name.tag#c06060
entity.other.attribute-name#b08040italic
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#b08040
support.type.property-name.css#5080a0
support.constant.property-value.css#b07050
punctuation#6a6070
punctuation.definition.block, punctuation.definition.parameters, punctuation.definition.array#6a6070
markup.heading, entity.name.section.markdown#c06060bold
markup.bold#b08040bold
markup.italic#a06080italic
markup.underline.link#5080a0
markup.inline.raw, markup.fenced_code#609070
support.type.property-name.json#c06060
entity.name.tag.yaml#c06060
string.regexp#508090
invalid, invalid.illegal#f8f5f0
invalid.deprecated#f8f5f0

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...