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#0e2038
  • activityBar.foreground#fca311
  • activityBar.inactiveForeground#b3b3b3
  • activityBarBadge.background#fca311
  • activityBarBadge.foreground#0e2038
  • button.background#fca311
  • button.foreground#0e2038
  • editor.background#1a2a43
  • editor.lineHighlightBackground#0e2038
  • editorCursor.background#0e2038
  • editorCursor.foreground#aeaeae
  • editorGroupHeader.noTabsBackground#0e2038
  • editorGroupHeader.tabsBackground#0e2038
  • editorHoverWidget.background#0e2038
  • editorLineNumber.activeForeground#fca311
  • editorLineNumber.foreground#a3b5c0
  • focusBorder#fca311
  • input.background#2f4c79
  • list.activeSelectionBackground#2f4c79
  • list.activeSelectionForeground#fca311
  • list.hoverBackground#1a2a43
  • panelTitle.activeBorder#fca311
  • panelTitle.activeForeground#fca311
  • quickInput.background#0e2038
  • sideBar.background#0b192c
  • sideBarSectionHeader.background#0e2038
  • sideBarSectionHeader.foreground#b3b3b3
  • sideBarTitle.foreground#b3b3b3
  • statusBar.background#0e2038
  • statusBar.foreground#b3b3b3
  • tab.activeBorderTop#fca311
  • tab.hoverBackground#1a2a43
  • tab.inactiveBackground#0b192c
  • tab.unfocusedActiveBackground#0b192c
  • titleBar.activeBackground#0e2038
  • titleBar.activeForeground#b3b3b3
  • widget.shadow#304b6e
  • window.activeBorder#0e2038

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta, support.class, keyword.operator.type.annotation, punctuation.separator.key-value, constant.language.undefined, constant.language.null, punctuation.separator.key-value, punctuation.definition.entity, punctuation.section.function, punctuation.separator.list.comma#d34848
string, constant.language.boolean, constant.language, support.constant.property-value, meta.property-value, constant.numeric, constant.numeric.integer#2AA198
comment#718a92italic
storage.type, keyword.control, keyword.operator, storage.modifier, support.type.property-name, support.class.component, entity.other.keyframe-offset, entity.name.tag.tsx, entity.name.tag.jsx#91c528
variable.parameter, variable.other, variable.other.constant, variable.language.this, variable.other.readwrite.alias, meta.decorator, support.type.object, meta.paragraph.markdown, text.html.markdown, meta.jsx.children, variable.parameter.keyframe-list#b3b3b3
entity.name.function, variable.other.object.property, variable.parameter, meta.object-literal.key, entiry.name.tag, valuable.object.property, markup.heading.markdown, meta.object-literal.key, entity.name.tag, variable.object.property, entity.other.attribute-name, meta.at-rule.media.header, support.type.property-name.css, support.function, meta.property-name, variable.language.super#359edf
keyword.control.import, keyword.control.from, meta.type.annotation, meta.return.type, entity.name.type, entiry.other.inherited-class, entity.name.tag.css, support.type.builtin, support.type.primitive, markup.underline.link.markdown#d3a548
Bourbon by ush - VS Code Theme