Skip to main content
Coding Theme

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.activeBorder#9dff00
  • activityBar.background#00070b
  • activityBar.border#9dff00
  • activityBar.foreground#f8fff4
  • activityBarBadge.background#ff5ac6
  • activityBarBadge.foreground#00070b
  • badge.background#ff5ac6
  • badge.foreground#021013
  • button.background#9dff00
  • button.foreground#021013
  • button.hoverBackground#c0ff4f
  • chat.requestBackground#6aac0033
  • chat.slashCommandBackground#10311f
  • dropdown.background#06211a
  • dropdown.border#9dff0088
  • editor.background#01080d
  • editor.foreground#f8fff4
  • editor.inactiveSelectionBackground#0c240d2a
  • editor.lineHighlightBackground#071720
  • editor.selectionBackground#12320f
  • editorCursor.foreground#9dff00
  • editorGroup.border#9dff00
  • editorGroupHeader.noTabsBackground#01080d
  • editorGroupHeader.tabsBackground#01080d
  • editorLineNumber.activeForeground#9dff00
  • editorLineNumber.foreground#58705a
  • editorWhitespace.foreground#314438
  • focusBorder#9dff0088
  • input.background#06211a
  • input.border#9dff0088
  • input.foreground#f8fff4
  • input.placeholderForeground#c9f0cd
  • list.activeSelectionBackground#6aac0033
  • list.activeSelectionForeground#f8fff4
  • list.dropBackground#9dff0044
  • list.focusBackground#18422d
  • list.hoverBackground#134434
  • list.inactiveSelectionBackground#071f16
  • menu.background#02171f
  • menu.foreground#f8fff4
  • menu.selectionBackground#10311f
  • menubar.selectionBackground#10311faa
  • panel.background#02171f
  • panel.border#9dff00
  • panelTitle.activeForeground#f2ff39
  • panelTitle.inactiveForeground#bde3c4
  • peekView.border#9dff00
  • peekViewEditor.background#01080d
  • peekViewResult.background#021013
  • selection.background#12320f
  • sideBar.background#021013
  • sideBar.border#9dff00
  • sideBar.foreground#f8fff4
  • sideBarSectionHeader.background#04171c
  • sideBarSectionHeader.border#9dff00
  • sideBarSectionHeader.foreground#44ffe9
  • sideBarTitle.foreground#f2ff39
  • statusBar.background#021013
  • statusBar.border#9dff00
  • statusBar.debuggingBackground#ff5ac6
  • statusBar.debuggingForeground#021013
  • statusBar.foreground#f8fff4
  • tab.activeBackground#04171c
  • tab.activeBorder#f2ff39
  • tab.activeForeground#f8fff4
  • tab.border#9dff00
  • tab.inactiveBackground#00070b
  • tab.inactiveForeground#bde3c4
  • terminal.ansiBlack#010a0f
  • terminal.ansiBlue#38c1ff
  • terminal.ansiBrightBlack#071720
  • terminal.ansiBrightBlue#7ad7ff
  • terminal.ansiBrightCyan#8cfff3
  • terminal.ansiBrightGreen#c8ff6d
  • terminal.ansiBrightMagenta#ff91dd
  • terminal.ansiBrightRed#ff8891
  • terminal.ansiBrightWhite#ffffff
  • terminal.ansiBrightYellow#fff5a3
  • terminal.ansiCyan#44ffe9
  • terminal.ansiGreen#9dff00
  • terminal.ansiMagenta#ff5ac6
  • terminal.ansiRed#ff5c66
  • terminal.ansiWhite#f8fff4
  • terminal.ansiYellow#f2ff39
  • terminal.background#010a0f
  • terminal.foreground#f8fff4
  • terminalCursor.foreground#f2ff39
  • titleBar.activeBackground#021013
  • titleBar.activeForeground#f8fff4
  • titleBar.border#9dff00
  • titleBar.inactiveBackground#021013
  • titleBar.inactiveForeground#c9f0cd
  • tree.indentGuidesStroke#3a6044

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6d9271italic
keyword, storage, storage.type, storage.modifier#ff5ac6
string, constant.other.symbol#9dff00
variable, entity.name.variable#f8fff4
entity.name.function, support.function#44ffe9
entity.name.type, support.type, storage.type.class#f2ff39
constant.numeric, constant.language#ff8891
punctuation, meta.brace, meta.delimiter#f8fff4
markup.heading, markup.heading entity.name.section, markup.heading.markdown#9dff00bold
markup.bold, markup.bold.markdown#f2ff39bold
markup.italic, markup.italic.markdown#44ffe9italic
markup.quote, markup.quote.markdown#bde3c4
markup.inline.raw, markup.fenced_code.block, markup.raw.block#38c1ff
punctuation.definition.heading, punctuation.definition.list.begin, markup.list.numbered, markup.list.unnumbered#ff5ac6