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.background#0A0F0A
  • activityBar.border#1a2a1a
  • activityBar.foreground#39FF14
  • activityBarBadge.background#39FF14
  • activityBarBadge.foreground#0A0F0A
  • badge.background#39FF14
  • badge.foreground#0A0F0A
  • button.background#39FF14
  • button.foreground#0A0F0A
  • button.hoverBackground#32DD12
  • debugIcon.breakpointForeground#FF4500
  • debugToolBar.background#0F150F
  • dropdown.background#0F150F
  • dropdown.border#39FF14
  • dropdown.foreground#C8E6C8
  • editor.background#040804
  • editor.findMatchBackground#7FFF0050
  • editor.findMatchHighlightBackground#7FFF0030
  • editor.foreground#E0FFE0
  • editor.lineHighlightBackground#0F150F
  • editor.selectionBackground#39FF1440
  • editor.wordHighlightBackground#39FF1430
  • editorBracketMatch.background#39FF1440
  • editorBracketMatch.border#39FF14
  • editorCursor.foreground#39FF14
  • editorGroupHeader.tabsBackground#0A0F0A
  • editorGutter.background#0A0F0A
  • editorIndentGuide.activeBackground1#39FF14
  • editorIndentGuide.background1#1a2a1a
  • editorLineNumber.activeForeground#39FF14
  • editorLineNumber.foreground#3a5a3a
  • editorSuggestWidget.background#0D120D
  • editorSuggestWidget.border#1a2a1a
  • editorSuggestWidget.highlightForeground#39FF14
  • editorSuggestWidget.selectedBackground#1a3a1a
  • editorWidget.background#0D120D
  • editorWidget.border#1a2a1a
  • focusBorder#39FF14
  • gitDecoration.conflictingResourceForeground#FFD700
  • gitDecoration.deletedResourceForeground#FF4500
  • gitDecoration.modifiedResourceForeground#7FFF00
  • gitDecoration.untrackedResourceForeground#39FF14
  • input.background#0F150F
  • input.border#39FF14
  • input.foreground#C8E6C8
  • input.placeholderForeground#3a5a3a
  • inputOption.activeBorder#39FF14
  • list.activeSelectionBackground#1a3a1a
  • list.activeSelectionForeground#39FF14
  • list.highlightForeground#39FF14
  • list.hoverBackground#1a2a1a
  • list.inactiveSelectionBackground#152515
  • minimap.background#0A0F0A
  • minimapSlider.activeBackground#39FF1460
  • minimapSlider.background#39FF1420
  • minimapSlider.hoverBackground#39FF1440
  • panel.background#0A0F0A
  • panel.border#1a2a1a
  • panelTitle.activeBorder#39FF14
  • panelTitle.activeForeground#39FF14
  • panelTitle.inactiveForeground#5a7a5a
  • peekView.border#39FF14
  • peekViewEditor.background#0D120D
  • peekViewResult.background#0F150F
  • peekViewTitle.background#0F150F
  • peekViewTitleLabel.foreground#39FF14
  • scrollbar.shadow#000000
  • scrollbarSlider.activeBackground#39FF1480
  • scrollbarSlider.background#39FF1440
  • scrollbarSlider.hoverBackground#39FF1460
  • sideBar.background#0D120D
  • sideBar.border#1a2a1a
  • sideBar.foreground#A8C8A8
  • sideBarSectionHeader.background#0F150F
  • sideBarSectionHeader.foreground#7FFF00
  • sideBarTitle.foreground#39FF14
  • statusBar.background#0A0F0A
  • statusBar.border#1a2a1a
  • statusBar.debuggingBackground#7FFF00
  • statusBar.debuggingForeground#0A0F0A
  • statusBar.foreground#39FF14
  • statusBarItem.hoverBackground#1a3a1a
  • tab.activeBackground#152515
  • tab.activeBorderTop#39FF14
  • tab.activeForeground#39FF14
  • tab.border#1a2a1a
  • tab.inactiveBackground#0A0F0A
  • tab.inactiveForeground#5a7a5a
  • terminal.ansiBlack#0A0F0A
  • terminal.ansiBlue#00CED1
  • terminal.ansiBrightBlack#3a5a3a
  • terminal.ansiBrightBlue#40E0D0
  • terminal.ansiBrightCyan#66FFE0
  • terminal.ansiBrightGreen#66FF44
  • terminal.ansiBrightMagenta#BA55D3
  • terminal.ansiBrightRed#FF6347
  • terminal.ansiBrightWhite#E8F6E8
  • terminal.ansiBrightYellow#ADFF2F
  • terminal.ansiCyan#00FFCC
  • terminal.ansiGreen#39FF14
  • terminal.ansiMagenta#9932CC
  • terminal.ansiRed#FF4500
  • terminal.ansiWhite#C8E6C8
  • terminal.ansiYellow#7FFF00
  • terminal.background#0A0F0A
  • terminal.foreground#C8E6C8
  • titleBar.activeBackground#0A0F0A
  • titleBar.activeForeground#39FF14
  • titleBar.inactiveBackground#080C08
  • titleBar.inactiveForeground#5a7a5a

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#3a6a3aitalic
keyword, storage.type, storage.modifier, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical, keyword.operator.sizeof, keyword.operator.typeof#7FFF00bold
string, string.quoted, string.template, punctuation.definition.string#39FF14bold
entity.name.function, support.function, meta.function-call, variable.function#00FFCCbold
constant.numeric, constant.language.boolean, constant.language.null, constant.language.undefined#FF6347
variable, variable.other, variable.parameter#C8E6C8
entity.name.type, entity.name.class, support.type, support.class, entity.other.inherited-class#ADFF2Fbold italic
keyword.operator, punctuation.accessor#00CED1
punctuation.bracket, punctuation.separator, punctuation.terminator, meta.brace#7a9a7a
constant, constant.other, variable.other.constant#FFD700bold
entity.name.tag, support.type.property-name, meta.object-literal.key#00FFCC
entity.name.tag.html, entity.name.tag.xml#7FFF00
entity.other.attribute-name#39FF14
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#ADFF2F
support.type.property-name.css#00FFCC
support.constant.property-value.css, support.constant.color.css#39FF14
string.regexp#FFD700
constant.character.escape#FF6347
heading.1.markdown, heading.2.markdown, heading.3.markdown, punctuation.definition.heading.markdown#39FF14bold
markup.bold#7FFF00bold
markup.italic#ADFF2Fitalic
markup.underline.link#00FFCC
markup.inline.raw, markup.fenced_code.block#39FF14
support.type.property-name.json#00FFCC
string.quoted.double.json#39FF14
invalid, invalid.illegal#FF4500underline
invalid.deprecated#FFD700strikethrough
Monkey Island Theme - Revenge's LeChuck Edition by fidelp27 - VS Code Theme