Skip to main content
Coding Theme

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#05070A
  • activityBar.foreground#00F0FF
  • button.background#00F0FFCC
  • button.foreground#0B0E14
  • editor.background#160101a6
  • editor.foreground#E0E6F1
  • editor.lineHighlightBackground#1A1D26
  • editor.selectionBackground#00F0FF33
  • editor.selectionHighlightBackground#00F0FF22
  • editor.wordHighlightBackground#82AAFF25
  • editorBracketHighlight.foreground1#00F0FF
  • editorBracketHighlight.foreground2#C792EA
  • editorBracketHighlight.foreground3#FFCB6B
  • editorBracketHighlight.unexpectedBracket.foreground#FF5370
  • editorBracketMatch.background#00F0FF25
  • editorBracketMatch.border#00F0FF
  • editorCursor.foreground#00F0FF
  • editorIndentGuide.activeBackground#00F0FF66
  • editorLineNumber.activeForeground#00F0FF
  • focusBorder#00F0FF33
  • input.background#1A1D26
  • sideBar.background#080A0F
  • sideBar.border#00000000
  • statusBar.background#05070A
  • statusBar.foreground#71f0f0
  • titleBar.activeBackground#000000
  • titleBar.activeForeground#71f0f0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
entity.name.tag, meta.tag.sgml, punctuation.definition.tag#F07178
entity.other.attribute-name#C792EAitalic
keyword, storage.type, storage.modifier, keyword.control#C792EAitalic
keyword.control.flow, storage.type.js, storage.type.ts#00F0FFbold
entity.name.function, meta.function-call, support.function#82AAFF
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#FFCB6B
support.type.property-name.css#EEFFFF
support.constant.property-value.css, constant.numeric.css#C3E88D
support.type.property-name.json#C792EA
string, constant.other.symbol#C3E88D
constant.numeric, constant.language.boolean#F78C6C
comment, punctuation.definition.comment#546E7Aitalic
AeroScript by Aditya Dubey - VS Code Theme