Skip to main content
CodingTheme

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#000
  • activityBarBadge.background#5600AC
  • badge.background#5600AC
  • button.background#5600AC
  • button.foreground#fff
  • button.hoverBackground#7000E0
  • editor.background#000
  • editor.findMatchBackground#73597ee0
  • editor.foreground#fff
  • editor.lineHighlightBackground#1A0033
  • editor.selectionBackground#73597ee0
  • editorCursor.foreground#fff
  • editorGroupHeader.tabsBackground#0c0c0c
  • editorWhitespace.foreground#404040
  • focusBorder#5600AC
  • input.border#5600AC
  • list.activeSelectionBackground#5600AC
  • notification.buttonBackground#5600AC
  • notification.buttonHoverBackground#7000E0
  • panelTitle.activeBorder#5600AC
  • sideBar.background#0c0c0c
  • sideBar.border#000
  • sideBar.foreground#fff
  • sideBarSectionHeader.background#161616
  • statusBar.background#5600AC
  • statusBar.debuggingBackground#ff9a00
  • statusBar.debuggingForeground#000
  • statusBar.noFolderBackground#5600AC
  • tab.activeBorder#5600AC
  • tab.border#161616
  • tab.inactiveBackground#161616
  • terminal.ansiBlack#404040
  • terminal.ansiBlue#c900ff
  • terminal.ansiBrightBlack#404040
  • terminal.ansiBrightBlue#c900ff
  • terminal.ansiBrightCyan#c900ff
  • terminal.ansiBrightGreen#09ff00
  • terminal.ansiBrightMagenta#c900ff
  • terminal.ansiBrightRed#c900ff
  • terminal.ansiBrightWhite#fff
  • terminal.ansiBrightYellow#d9ff00
  • terminal.ansiCyan#c900ff
  • terminal.ansiGreen#09ff00
  • terminal.ansiMagenta#c900ff
  • terminal.ansiRed#c900ff
  • terminal.ansiWhite#fff
  • terminal.ansiYellow#d9ff00
  • terminal.background#0c0c0c
  • titleBar.activeBackground#0c0c0c
  • titleBar.inactiveBackground#0c0c0c

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#fff
text#fff
source, variable.other.readwrite, meta.definition.variable variable.other.readwrite, meta.function.expression variable.other.readwrite#FFFFFF
comment, punctuation.definition.comment#434242
constant#c900ff
keyword, storage.type.class, storage.type, storage.modifier, support.class, entity.name.tag, variable.language, punctuation.accessor#ff9a00
punctuation.definition.entity, punctuation.dollar, punctuation.definition.variable#fff
entity.name.class, entity.other.attribute-name#c900ff
variable.other.object#fff
meta.property.object, meta.property-name, constant.other.symbol.hashkey, meta.object-literal.key, support.variable.property, variable.other.property, variable.other.object.property#09ff00
punctuation.separator.key-value, punctuation.separator.dictionary.key-value#ff9a00
constant.language.name, entity.name.type, entity.other.inherited-class#c900ff
meta.preprocessor.c#c900ff
entity.name.function, meta.function, meta.function variable.other.readwrite, meta.function punctuation.dollar, support.function, variable.parameter, variable.other.block, entity.other.attribute-name.pseudo-class, entity.other.attribute-name.pseudo-element#d9ff00
entity.name.function#c900ff
punctuation, meta.brace, meta.delimiter, meta.group.braces.round.function, punctuation source#9B9B9B
string#09ff00
string constant.character.escape#AAAAAA
string.interpolated#000000
string.regexp#09ff00
string.literal#09ff00
string.interpolated constant.character.escape#555555
entity.name.typeunderline
entity.other.inherited-classitalic underline
entity.name.tagunderline
entity.other.attribute-name
token.info-token#6796e6
token.warn-token#cd9731
token.error-token#f44747
token.debug-token#b267e6

Shiki preview

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

Loading...

All Hallows' Eve Plus by konapun - VS Code Theme