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#001a39
  • activityBar.foreground#efff73
  • activityBar.inactiveForeground#0069e6
  • activityBarBadge.background#efff73
  • activityBarBadge.foreground#4B4E29
  • breadcrumb.background#001a39
  • dropdown.background#002959
  • editor.background#001a39
  • editor.foreground#72ABD6
  • editor.lineHighlightBackground#002959
  • editor.lineHighlightBorder#001a39
  • editor.selectionBackground#0069e640
  • editorCursor.foreground#efff73
  • editorGroupHeader.tabsBackground#001a39
  • editorLineNumber.activeForeground#efff73
  • editorLineNumber.foreground#0069e6
  • editorSuggestWidget.background#002147
  • editorSuggestWidget.border#0069e6
  • editorSuggestWidget.focusHighlightForeground#efff73
  • editorSuggestWidget.highlightForeground#efff73
  • editorSuggestWidget.selectedBackground#0069e640
  • editorWidget.background#002147
  • editorWidget.border#0069e6
  • foreground#72ABD6
  • input.background#001a39
  • input.border#0069e6
  • list.activeSelectionBackground#002959
  • list.focusOutline#0069e6
  • list.hoverBackground#002959
  • list.inactiveSelectionBackground#002959
  • panel.border#efff73
  • sideBar.background#002147
  • sideBarSectionHeader.background#001a39
  • sideBarSectionHeader.foreground#2D658D
  • sideBarTitle.foreground#2D658D
  • statusBar.background#efff73
  • statusBar.debuggingBackground#E6427C
  • statusBar.debuggingForeground#001a39
  • statusBar.foreground#4B4E29
  • statusBar.noFolderBackground#0069e6
  • statusBar.noFolderForeground#e1e4f8
  • statusBarItem.hoverBackground#bdcf44
  • tab.activeBackground#0069e640
  • tab.activeForeground#e1e4f8
  • tab.activeModifiedBorder#efff73
  • tab.border#0069e6
  • tab.hoverBackground#0069e640
  • tab.hoverForeground#e1e4f8
  • tab.inactiveBackground#001a39
  • tab.inactiveForeground#2D658D
  • tab.inactiveModifiedBorder#efff73

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
variable.other.property#72ABD6
punctuation#2D658D
comment, punctuation.definition.comment#2D658Ditalic
string, punctuation.definition.string#64de83
variable, punctuation.definition.variable#efff73
constant, keyword.other.unit, punctuation.definition.constant, support.constant, punctuation.definition.entity#8373ff
keyword.operator#ffa65e
keyword, keyword.operator.new, storage.modifier#369CFFitalic
storage.type#369CFFitalic
keyword.other.type, support.type.primitive#ffa65e
support.function, support.class.builtin#ff73ef
support.class#ff7a73
meta.function-call, meta.method-call#9BC4E2
entity.name.type.namespace, support.other.namespace, punctuation.separator.inheritance#2D658Ditalic
support.type.property-name.json, punctuation.support.type.property-name#ff7a73
entity.name.function.target#13d3d3
meta.scope.prerequisites#64de83
markup.heading.markdown, punctuation.definition.heading.markdown#9BC4E2bold
punctuation.definition.markdown, fenced_code.block.language#2D658D
markup.fenced_code.block.markdown#176bcf
markup.inline.raw.string.markdown, punctuation.definition.raw.markdown#ffa65e
markup.underline.link#13d3d3
markup.quote.markdown#2D658D
markup.bold.markdown, punctuation.definition.bold.markdown#9BC4E2bold
markup.italic.markdown, punctuation.definition.italic.markdown#9BC4E2italic
markup.strikethrough.markdown, punctuation.definition.strikethrough.markdown#9BC4E2
entity.name.tag, punctuation.definition.tag#ff7a73
entity.other.attribute-name#ffa65e
support.class.component#13d3d3
punctuation.section.embedded#ffa65e
keyword.other.phpdoc#2D658Ditalic bold
support.attribute.php, meta.attribute.php, entity.name.variable.parameter#2D658Ditalic
keyword.control.at-rule, punctuation.definition.keyword, punctuation.definition.interpolation#369CFF
punctuation.definition.entity.css#ffa65e
punctuation.definition.template-expression#ff7a73
punctuation.definition.block.tag.jsdoc, storage.type.class.jsdoc#2D658Dbold italic
meta.brace.round.ts, meta.brace.square.ts#2D658D
Oxford-blue Theme by asispts - VS Code Theme