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.activeBorder#0099ff62
  • activityBar.background#181818
  • activityBar.border#202020
  • activityBarBadge.background#1568a0
  • diffEditor.diagonalFill#839ed81f
  • diffEditor.insertedTextBackground#15ca8e1f
  • diffEditor.removedTextBackground#ff00552f
  • dropdown.background#282a2b
  • dropdown.border#282a2b
  • editor.background#161616
  • editor.findMatchBackground#ffcc23
  • editor.findMatchHighlightBackground#fffa9f
  • editor.foldBackground#00000000
  • editor.foreground#ffffff
  • editor.inactiveSelectionBackground#0099ff4f
  • editor.lineHighlightBackground#0099ff1e
  • editor.selectionBackground#0099ff4f
  • editor.selectionHighlightBackground#0099ff4f
  • editor.selectionHighlightBorder#0099ff36
  • editorBracketMatch.background#db179a
  • editorBracketMatch.border#00000000
  • editorGroupHeader.tabsBackground#1a1a1a
  • editorIndentGuide.activeBackground#273d4b9c
  • editorIndentGuide.background#ffffff06
  • editorLineNumber.activeForeground#ffffff
  • editorLineNumber.foreground#464646
  • editorOverviewRuler.background#151515
  • editorOverviewRuler.border#232323
  • editorOverviewRuler.findMatchForeground#fffbb5a4
  • extensionButton.prominentBackground#0cbd82
  • extensionButton.prominentForeground#0b0b0b
  • extensionButton.prominentHoverBackground#0ae99f
  • focusBorder#0000005b
  • input.background#282a2b
  • input.border#282a2b
  • list.focusOutline#00000000
  • list.hoverBackground#373a3b6c
  • list.inactiveSelectionBackground#0b476f
  • list.inactiveSelectionForeground#ffffff
  • menu.background#101010
  • menu.border#101010
  • menu.foreground#acacac
  • menu.separatorBackground#3a3a3a
  • menubar.selectionBackground#0b476f
  • menubar.selectionBorder#00000000
  • minimap.background#181818
  • minimap.findMatchHighlight#fffbb59a
  • minimap.selectionHighlight#0099ff
  • minimapSlider.activeBackground#ffffff1e
  • minimapSlider.background#ffffff19
  • minimapSlider.hoverBackground#ffffff1e
  • panel.background#181818
  • panel.border#222222
  • scrollbar.shadow#0000001f
  • scrollbarSlider.activeBackground#ffffff47
  • scrollbarSlider.background#ffffff32
  • scrollbarSlider.hoverBackground#ffffff47
  • settings.focusedRowBackground#282d303d
  • sideBar.background#181818
  • sideBar.border#222222
  • sideBar.foreground#acacac
  • statusBar.background#262626
  • statusBar.debuggingBackground#fcce00
  • statusBar.debuggingForeground#0b0b0b
  • statusBar.foreground#868686
  • statusBar.noFolderBackground#262626
  • statusBar.noFolderForeground#868686
  • statusBarItem.hoverBackground#00000038
  • statusBarItem.remoteBackground#106399
  • statusBarItem.remoteForeground#ffffff
  • tab.activeBackground#0b476f36
  • tab.activeBorderTop#103955
  • tab.border#00000000
  • tab.hoverBackground#1e77b333
  • tab.inactiveBackground#1a1a1a
  • titleBar.activeBackground#1a1a1a
  • titleBar.border#161616
  • titleBar.inactiveBackground#1a1a1a

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
source.php, source.php punctuation, source.php keyword.operator, source.php string punctuation.section.array, source.php punctuation.terminator#ffffff
source.php meta.function-call support.function, source.php support.function, support.function.construct.output, source.php keyword.control.exit, source.php keyword.control.import.include#ebebebbold italic
source.php comment, source.php comment keyword.other, source.php comment punctuation, source.php comment support.class punctuation.separator.inheritance, source.php comment support.other.namespace, source.php comment support.other.namespace punctuation.separator.inheritance, source.php comment support.other, source.php comment.block.documentation support.class, source.php comment.block.documentation support punctuation, source.php comment.block.documentation punctuation, source.php comment.block.documentation punctuation.definition#95927e
source.php meta.trait entity.name, source.php meta.interface entity.name, source.php meta.namespace entity.name, source.php meta.namespace entity.name punctuation, source.php meta.function entity.name, source.php meta.function support.function.magic, source.php meta.function support.function.constructor, source.php meta.function punctuation.definition.variable, source.php meta.class entity.name.type.class, source.php meta.use entity.other.alias, source.php meta.function variable#e7c500bold
source.php storage.modifier.reference, source.php keyword.operator.nullable-type#00e78fbold
source.php constant.numeric, source.php constant.numeric punctuation#ff6161bold
source.php string, source.php string punctuation, source.php string keyword, source.php string keyword.operator, source.php string source.sql, source.php string source.sql keyword.other, source.php string source.sql constant.numeric, source.php string source.sql support.function#ffa2ea
source.php constant.language#b086eebold
source.php storage, source.php keyword.other, source.php meta.namespace, source.php meta.function, source.php meta.use keyword, source.php meta.class storage, source.php meta.class keyword.other.new, source.php keyword.control, source.php keyword.other.new, source.php keyword.operator.type, source.php meta.function.parameter.typehinted punctuation.separator.delimiter, source.php meta.function.parameter.typehinted storage.type#80b7ff
source.php keyword.operator.logical#80b7ffunderline
source.php variable, source.php variable punctuation.definition#46d4ff
source.php support.class, source.php meta.other.inherited-class, source.php meta.method-call entity.name.function, source.php meta.function-call entity.name.function, source.php meta.function-call support.other.namespace, source.php support.class punctuation.separator.inheritance, source.php support.other.namespace, source.php support.other.namespace punctuation.separator.inheritance, source.php meta.function-call support.class, source.php string.unquoted.index, source.php meta.use support, source.php meta.use support punctuation, source.php meta.class support, source.php meta.class support punctuation, source.php meta.method-call, source.php variable.other.property#aaeaaa
source.php constant.other, source.php support.constant#7ece7ebold
source.css, source.css punctuation#ffffff
source.css comment#95927e
source.css comment punctuation#95927e
source.css entity.other.attribute-name, source.css entity.other.attribute-name punctuation#e0e0e0
source.css meta.attribute-selector entity.other.attribute-name, source.css meta.attribute-selector entity.other.attribute-name#80fff9
source.css entity.other.attribute-name.pseudo-element punctuation.definition, source.css entity.other.attribute-name.pseudo-class punctuation.definition#e0e0e0underline
source.css entity.other.attribute-name.pseudo-element, source.css entity.other.attribute-name.pseudo-class#64fff7
source.css meta.property-value, source.css meta.at-rule variable.parameter#aaeaaa
source.css meta.property-list, source.css meta.at-rule support.type.property-name#c7e58a
source.css meta.at-rule keyword.control, source.css meta.at-rule keyword.control punctuation#e7c500bold
source.css constant.numeric#ff6161
source.css string, source.css string punctuation#ffa2ea
source.css entity.name#ec4fb8bold
source.css meta.at-rule entity.other#ec4fb8
source.css support.constant, source.css constant.other.color, source.css constant.other.color punctuation, source.css invalid.deprecated, source.css support.function#b086eebold
source.css keyword.other.important#80b7ff
text.html, text.html meta.tag.metadata.processing.xml entity.name, text.html meta.tag.metadata.processing.xml punctuation.definition.tag, text.html meta.attribute punctuation.section.embedded.begin.php, text.html meta.attribute punctuation.section.embedded.end.php, text.xml, text.xml meta.tag.preprocessor.xml entity.name, text.xml meta.tag.preprocessor.xml punctuation.definition.tag#ffffff
text.html comment, text.xml comment#95927e
text.html meta.attribute string, text.xml string#ffa2ea
text.html meta.tag entity.name, text.html punctuation.definition.tag, text.html entity.name.tag.style, text.html entity.name.tag.script, text.html meta.tag punctuation.definition.tag, text.xml meta.tag entity.name, text.xml meta.tag punctuation.definition.tag#ec4fb8
text.html meta.attribute entity.other, text.xml entity.other.attribute-name#8ae5c9
text.html.twig, text.html.twig punctuation, text.html.twig keyword.operator.assignment#ffffff
text.html.twig meta.tag.template support.function#ebebebbold italic
text.html.twig comment.block punctuation#95927e
text.html.twig punctuation.section.tag#e7c500italic
text.html.twig string, text.html.twig string punctuation.definition#ffa2ea
text.html.twig meta.tag entity.other, text.html.twig entity.other.attribute-name.html#8ae5c9
text.html.twig variable#46d4ff
text.html.twig variable.other.property#aaeaaa
text.html.twig meta.tag.template keyword.control, text.html.twig meta.tag.template keyword.operator#80b7ff
text.html.twig meta.tag.template constant.language#b086eebold
text.html.twig meta.tag.template constant.numeric#ff6161bold
text.html.php.blade, text.html.php.blade meta.directive#ffffff
text.html.php.blade support.function.construct.begin, text.html.php.blade support.function.construct.end#e7c500bold
text.html.php.blade keyword.blade, text.html.php.blade punctuation.section.embedded.begin, text.html.php.blade punctuation.section.embedded.end, text.html.php.blade entity.name.function.blade#80b7ff
text.html.php.blade punctuation.definition.variable#46d4ff
text.html.php.blade source.php entity.name.class#aaeaaa
text.html.php.blade string#ffa2ea
source.latte, source.latte keyword, source.latte keyword.control.print#ffffff
source.latte keyword.other.function-name#ffffffbold italic
source.latte comment#95927e
source.latte string#ffa2ea
source.latte meta.tag entity.name, source.latte punctuation.definition.tag, source.latte entity.name.tag.style, source.latte entity.name.tag.script, source.latte meta.tag punctuation.definition.tag#ec4fb8
source.latte variable.other.property.latte, source.latte keyword.control.pair.latte#aaeaaa
source.latte meta.attribute entity.other#8ae5c9
source.latte variable#46d4ff
source.latte tag.begin, source.latte tag.end#e7c500bold
source.latte keyword.control#80b7ff
source.latte keyword.operator.logical#80b7ffunderline
source.latte constant.numeric#ff6161bold
source.js, source.js meta.object-literal punctuation, source.js meta.template.expression, source.js storage.type.function.arrow#ffffff
source.js comment, source.js comment storage, source.js comment storage.type#95927e
source.js support.function, source.js support.class.builtin, source.js meta.function punctuation.accessor#ebebebitalic bold
source.js string, source.js meta.object-literal string punctuation#ffa2ea
source.js constant.language#b086eebold
source.js storage, source.js variable.language.this, source.js keyword.control, source.js keyword.operator.expression, source.js keyword.operator.new, source.js meta.method.declaration storage.type.property, source.js meta.method.declaration storage.type.function, source.js meta.method.declaration meta.var.expr storage, source.js support.class.builtin, source.js support.type.object, source.js support.variable.property#80b7ff
source.js keyword.operator.logical#80b7ffunderline
source.js variable.other.object, source.js variable.other.readwrite, source.js meta.export.default variable.other.readwrite, source.js meta.block variable.parameter#46d4ff
source.js meta.template punctuation.definition.template-expression#ffffff
source.js variable.other.constant, source.js support.constant#aaeaaabold
source.js meta.export entity.name, source.js meta.export entity.other.inherited-class, source.js support.class#aaeaaa
source.js meta.function-call variable.other.object.property, source.js meta.function-call entity.name, source.js meta.objectliteral meta.object-literal.key, source.js meta.class variable.other.property, source.js variable.other.object.property, source.js variable.other.property, source.js entity.name.function#d2f386
source.js meta.method.declaration storage, source.js variable.parameter, source.js meta.definition.variable, source.js meta.definition.variable entity.name.function, source.js meta.definition.variable variable.other.readwrite, source.js entity.name.type.class, source.js meta.class meta.definition.method entity.name, source.js meta.definition.function entity.name, source.js meta.definition.variable variable.other.constant, source.js meta.definition.function entity.name.function, source.js meta.definition.property, source.js meta.import variable.other.readwrite.alias#e7c500bold
source.js constant.numeric#ff6161bold
source.js.jsx meta.tag.js.jsx keyword.operator.assignment, source.js.jsx meta.tag.js.jsx punctuation, source.js.jsx meta.tag.js.jsx meta.embedded#ffffff
source.js.jsx meta.tag.js.jsx comment punctuation#95927e
source.js.jsx meta.tag punctuation.definition.tag, source.js.jsx meta.tag entity.name#ec4fb8
source.js.jsx meta.tag.js.jsx punctuation.definition.string#ffa2ea
source.js.jsx meta.tag.js.jsx meta.tag.attributes#8ae5c9
source.js.jsx meta.tag.js.jsx support.class.component#aaeaaa
source.ts, source.ts meta.object-literal punctuation, source.ts meta.template.expression, source.ts storage.type.function.arrow#ffffff
source.ts comment, source.ts comment storage, source.ts comment storage.type#95927e
source.ts support.function, source.ts support.class.builtin, source.ts meta.function punctuation.accessor#ebebebitalic bold
source.ts string, source.ts meta.object-literal string punctuation#ffa2ea
source.ts constant.language#b086eebold
source.ts storage, source.ts variable.language.this, source.ts keyword.control, source.ts keyword.operator.expression, source.ts keyword.operator.new, source.ts meta.method.declaration storage.type.property, source.ts meta.method.declaration storage.type.function, source.ts meta.method.declaration meta.var.expr storage, source.ts support.class.builtin, source.ts support.type.object, source.ts support.variable.property, source.ts meta.return.type support.type.primitive, source.ts meta.type.annotation support.type.primitive, source.ts meta.type.annotation keyword.operator.type.ts, source.ts meta.type.annotation support.type.builtin, source.ts meta.type.declaration support.type.primitive, source.ts meta.type.parameters support.type#80b7ff
source.ts keyword.operator.logical#80b7ffunderline
source.ts variable.other.object, source.ts variable.other.readwrite, source.ts meta.export.default variable.other.readwrite, source.ts meta.block variable.parameter#46d4ff
source.ts meta.template punctuation.definition.template-expression#ffffff
source.ts variable.other.constant, source.ts support.constant#aaeaaabold
source.ts meta.export entity.name, source.ts meta.export entity.other.inherited-class, source.ts meta.class entity.other, source.ts support.class, source.ts meta.type.annotation entity.name.type, source.ts meta.return.type entity.name.type, source.ts meta.type.declaration entity.name.type, source.ts meta.type.parameters entity.name.type#aaeaaa
source.ts meta.type.parameters, source.ts meta.type.parameters entity.name.type, source.ts meta.type.parameters support.typeitalic underline
source.ts meta.function-call variable.other.object.property, source.ts meta.function-call entity.name, source.ts meta.objectliteral meta.object-literal.key, source.ts meta.class variable.other.property, source.ts variable.other.object.property, source.ts variable.other.property, source.ts entity.name.function, source.ts variable.other.enummember, source.ts meta.definition.property variable.object.property#d2f386
source.ts meta.method.declaration storage, source.ts variable.parameter, source.ts meta.definition.variable, source.ts meta.definition.variable entity.name.function, source.ts meta.definition.variable variable.other.readwrite, source.ts entity.name.type.class, source.ts meta.class meta.definition.method entity.name, source.ts meta.definition.function entity.name, source.ts meta.definition.variable variable.other.constant, source.ts meta.definition.function entity.name.function, source.ts meta.definition.property, source.ts entity.name.type, source.ts meta.import variable.other.readwrite.alias, source.ts meta.type.declaration entity.name.type.alias#e7c500bold
source.ts constant.numeric#ff6161bold
source.ts meta.parameters keyword.operator.optional#00e78fbold
source.tsx, source.tsx meta.object-literal punctuation, source.tsx meta.template.expression, source.tsx storage.type.function.arrow#ffffff
source.tsx comment, source.tsx comment storage, source.tsx comment storage.type#95927e
source.tsx support.function, source.tsx support.class.builtin, source.tsx meta.function punctuation.accessor#ebebebitalic bold
source.tsx string, source.tsx meta.object-literal string punctuation#ffa2ea
source.tsx constant.language#b086eebold
source.tsx storage, source.tsx variable.language.this, source.tsx keyword.control, source.tsx keyword.operator.expression, source.tsx keyword.operator.new, source.tsx meta.method.declaration storage.type.property, source.tsx meta.method.declaration storage.type.function, source.tsx meta.method.declaration meta.var.expr storage, source.tsx support.class.builtin, source.tsx support.type.object, source.tsx support.variable.property, source.tsx meta.return.type support.type.primitive, source.tsx meta.type.annotation support.type.primitive, source.tsx meta.type.annotation keyword.operator.type.ts, source.tsx meta.type.annotation support.type.builtin, source.tsx meta.type.declaration support.type.primitive, source.tsx meta.type.parameters support.type#80b7ff
source.tsx keyword.operator.logical#80b7ffunderline
source.tsx variable.other.object, source.tsx variable.other.readwrite, source.tsx meta.export.default variable.other.readwrite, source.tsx meta.block variable.parameter#46d4ff
source.tsx meta.template punctuation.definition.template-expression#ffffff
source.tsx variable.other.constant, source.tsx support.constant#aaeaaabold
source.tsx meta.export entity.name, source.tsx meta.export entity.other.inherited-class, source.tsx meta.class entity.other, source.tsx support.class, source.tsx meta.type.annotation entity.name.type, source.tsx meta.return.type entity.name.type, source.tsx meta.type.declaration entity.name.type, source.tsx meta.type.parameters entity.name.type#aaeaaa
source.tsx meta.type.parameters, source.tsx meta.type.parameters entity.name.type, source.tsx meta.type.parameters support.typeitalic underline
source.tsx meta.function-call variable.other.object.property, source.tsx meta.function-call entity.name, source.tsx meta.objectliteral meta.object-literal.key, source.tsx meta.class variable.other.property, source.tsx variable.other.object.property, source.tsx variable.other.property, source.tsx entity.name.function, source.tsx variable.other.enummember, source.tsx meta.definition.property variable.object.property#d2f386
source.tsx meta.method.declaration storage, source.tsx variable.parameter, source.tsx meta.definition.variable, source.tsx meta.definition.variable entity.name.function, source.tsx meta.definition.variable variable.other.readwrite, source.tsx entity.name.type.class, source.tsx meta.class meta.definition.method entity.name, source.tsx meta.definition.function entity.name, source.tsx meta.definition.variable variable.other.constant, source.tsx meta.definition.function entity.name.function, source.tsx meta.definition.property, source.tsx entity.name.type, source.tsx meta.import variable.other.readwrite.alias, source.tsx meta.type.declaration entity.name.type.alias#e7c500bold
source.tsx constant.numeric#ff6161bold
source.tsx meta.parameters keyword.operator.optional#00e78fbold
source.tsx meta.tag keyword.operator.assignment, source.tsx meta.tag punctuation, source.tsx meta.tag meta.embedded#ffffff
source.tsx meta.tag comment punctuation#95927e
source.tsx meta.tag punctuation.definition.tag, source.tsx meta.tag entity.name#ec4fb8
source.tsx meta.tag punctuation.definition.string#ffa2ea
source.tsx meta.tag meta.tag.attributes#8ae5c9
source.tsx meta.tag support.class.component#aaeaaa
source.json#ffffff
source.json comment#95927e
source.json string.quoted#ffa2ea
source.json support.type.property-name#ec4fb8bold
source.json constant.numeric#ff6161bold
source.json constant.language#b086eebold
source.coffee#ffffff
source.coffee comment#95927e
source.coffee string#ffa2ea
source.coffee punctuation.definition.escape.backslash#ffa2e942
source.sql#aaeaaa
source.sql keyword.operator#ffffff
source.sql comment#95927e
source.sql keyword, source.sql storage#80b7ff
source.sql string.quoted.other.backtick#46d4ff
source.sql meta.create#e7c500bold
source.sql constant.numeric#ff6161bold
source.sql string#ffa2ea
source.ini#aaeaaa
source.ini punctuation.separator.key-value#ffffff
source.ini comment#95927e
source.ini entity.name.section#ec4fb8bold
source.ini string#ffa2ea
source.ini keyword.other.definition#e7c500bold
source.apacheconf#aaeaaa
source.apacheconf entity.helper#aaeaaa
source.apacheconf string.replacement#80b7ff
#ffffff
source.apacheconf comment#95927e
source.apacheconf entity.tag, source.apacheconf punctuation.definition.tag#ec4fb8bold
source.apacheconf string.regexp, source.apacheconf string.value#ffa2ea
source.apacheconf keyword#e7c500bold
text.html.markdown meta.tag meta.attribute .separator.key-value, text.html.markdown#ffffff
text.html.markdown meta.paragraph, text.html.markdown meta.link.reference string.other.link.title#cfcfce
text.html.markdown markup#d68455bold
text.html.markdown markup.list punctuation.definition.list.begin#ffffffbold
text.html.markdown markup.inline.raw, text.html.markdown markup.fenced_code#d2f386italic
text.html.markdown meta.tag meta.attribute#8ae5c9
text.html.markdown markup.heading#ffc400bold
text.html.markdown meta.link markup#b086eeitalic underline
text.html.markdown meta.link string.other.link.title, text.html.markdown meta.link punctuation.definition.string, text.html.markdown meta.link.reference constant.other.reference.link, text.html.markdown meta.link.reference punctuation.definition, text.html.markdown meta.link.reference punctuation.separator#b994f0bold underline
text.html.markdown meta.image markup#e966bditalic underline
text.html.markdown meta.image string.other.link.description, text.html.markdown meta.image punctuation.definition.string#e966bdbold underline
source.shell comment#95927e
source.shell entity.name#80b7ff
source.shell constant#aaeaaa
source.shell string#ffa2ea
source.shell variable#46d4ff
Galastri Dark Theme For VS Code by André Galastri - VS Code Theme