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.

  • editor.background#062037
  • editor.foreground#FFFFFF
  • editor.lineHighlightBackground#062037aa
  • editor.selectionBackground#B36539BF
  • editorCursor.foreground#FFFFFF
  • editorGroupHeader.tabsBackground#03192D
  • editorWhitespace.foreground#FFFFFF26
  • sideBar.background#2f2f2b
  • sideBar.border#152119
  • sideBar.foreground#f9faea
  • sideBarSectionHeader.background#13324d
  • sideBarSectionHeader.border#fff99e
  • statusBar.background#372911
  • statusBar.debuggingBackground#d38416
  • statusBar.noFolderBackground#1c1b19
  • statusBarItem.activeBackground#ae0331
  • tab.activeBackground#062037
  • tab.activeForeground#FFFFFF
  • tab.inactiveBackground#03192D
  • tab.inactiveForeground#B1B9C0
  • titleBar.activeBackground#b0b0b4
  • titleBar.activeForeground#292830

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
punctuation - (punctuation.definition.string | punctuation.definition.comment)#FFFFFF
constant#DCF710
constant.language#98E1FF
entity#FDFF9A
entity.name.type#FFB3E9underline bold
entity.name.function#F9B7DC
keyword#F4B043
keyword.operator#FDFF9A
constant.numeric#FFFFFF
storage#9580FF
string#46F009
comment#5DA9ECitalic
support#80FFBB
variable#ECD7A4
variable.language#80FFBB
variable.other#7FF5F8
support.class#FF6D6D
meta.function-call, meta.function.call entity.name.function#FFEE80
meta.macro entity.name.function#FF8080
invalid#F8F8F8
text source, string.unquoted.heredoc, source source, meta.embedded#FFFFFF
entity.other.inherited-class#FF5858italic
string.quoted source#9EFF80
string constant#80FF82
string.regexp#80FFC2
string variable#EDEF7D
support.function#FFFFFF
support.function.macro#FF6767
support.constant#EB939A
support.type.exception#FF1E00
meta.tag.metadata.doctype entity, meta.tag.metadata.doctype string, meta.tag.metadata.processing.xml, meta.tag.metadata.processing.xml entity, meta.tag.metadata.processing.xml string#73817D
meta.tag, meta.tag entity#9EFFFF
meta.selector.css entity.name.tag#9EFFFF
meta.selector.css entity.other.attribute-name.id#FFB454
meta.selector.css entity.other.attribute-name.class#5FE461
support.type.property-name.css#9DF39F
meta.property-group support.constant.property-value.css, meta.property-value support.constant.property-value.css#F6F080
meta.preprocessor.at-rule keyword.control.at-rule#F6AA11
meta.property-value support.constant.named-color.css, meta.property-value constant#EDF080
meta.constructor.argument.css#EB939A
meta.diff, meta.diff.header#F8F8F8
markup.deleted#F8F8F8
markup.changed#F8F8F8
markup.inserted#F8F8F8
markup.raw
markup.quote
markup.list#80FFBB
markup.bold#C1AFFFbold
markup.italic#B8FFD9italic
markup.heading#C8E4FDbold
string.json support.type.property-name.json#DCF710
string.json support.type.property-name.json punctuation#FFFFFF
text.html meta.attribute.data-x entity.other.attribute-name.html#DCF710
meta.directive.vue entity.other.attribute-name.html#DCF710
text.asciidoc markup.heading.heading-0, text.asciidoc markup.heading.heading-1, text.asciidoc markup.heading.heading-2, text.asciidoc markup.heading.heading-3, text.asciidoc markup.heading.heading-4, text.asciidoc markup.heading.heading-5#FDFF9A
Gessetti-theme by tkmfujise - VS Code Theme