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#101315
  • activityBar.foreground#E0E0E0
  • activityBarBadge.foreground#E0E0E0
  • badge.foreground#E0E0E0
  • button.background#9fced11f
  • button.foreground#E0E0E0
  • dropdown.background#101315
  • dropdown.border#101315
  • dropdown.foreground#E0E0E0
  • editor.background#191d21
  • editor.foreground#E0E0E0
  • editor.hoverHighlightBackground#F4457D22
  • editor.lineHighlightBackground#191d2122
  • editor.selectionBackground#53A1FA55
  • editor.wordHighlightBackground#53A1FA22
  • editor.wordHighlightStrongBackground#53A1FA22
  • editorBracketMatch.background#F4457D44
  • editorBracketMatch.border#53A1FA
  • editorCursor.foreground#E0E0E0
  • editorGroupHeader.tabsBackground#161616
  • editorGutter.addedBackground#5BD1B9
  • editorGutter.background#191d21
  • editorGutter.deletedBackground#E61F44
  • editorGutter.modifiedBackground#F9C35A
  • editorIndentGuide.background1#191d2188
  • editorInlayHint.background#34393E
  • editorInlayHint.foreground#E0E0E0
  • editorLineNumber.foreground#45505b
  • editorLink.activeForeground#F4457D
  • editorOverviewRuler.addedForeground#5BD1B9
  • editorOverviewRuler.deletedForeground#E61F44
  • editorOverviewRuler.errorForeground#E61F44
  • editorOverviewRuler.findMatchForeground#53A1FA55
  • editorOverviewRuler.infoForeground#B267E6
  • editorOverviewRuler.modifiedForeground#F9C35A
  • editorOverviewRuler.warningForeground#F9C35A
  • editorRuler.foreground#34393E
  • editorSuggestWidget.foreground#E0E0E0
  • editorSuggestWidget.highlightForeground#F4457D
  • editorSuggestWidget.selectedBackground#45505b
  • editorWhitespace.foreground#34393E
  • editorWidget.background#34393E
  • editorWidget.border#45505b
  • extensionButton.prominentBackground#F4457D
  • extensionButton.prominentForeground#E0E0E0
  • extensionButton.prominentHoverBackground#EE808B
  • foreground#E0E0E0
  • input.background#101315
  • input.border#45505b
  • input.foreground#E0E0E0
  • input.placeholderForeground#45505b
  • inputOption.activeBorder#53A1FA
  • list.activeSelectionForeground#E0E0E0
  • list.focusBackground#3A434D
  • list.hoverBackground#1d2226
  • list.inactiveSelectionBackground#191d21
  • panel.background#191d21
  • panel.border#45505b
  • panelTitle.activeBorder#F4457D
  • panelTitle.inactiveForeground#45505b
  • peekView.border#F4457D
  • peekViewEditor.background#101315
  • peekViewEditor.matchHighlightBackground#53A1FA55
  • peekViewEditorGutter.background#101315
  • peekViewResult.background#34393E
  • peekViewResult.fileForeground#E0E0E0
  • peekViewResult.lineForeground#E6E6E6
  • peekViewResult.matchHighlightBackground#53A1FA55
  • peekViewResult.selectionBackground#1d2226
  • peekViewResult.selectionForeground#E0E0E0
  • peekViewTitle.background#101315
  • peekViewTitleDescription.foreground#E0E0E0
  • peekViewTitleLabel.foreground#E6E6E6
  • progressBar.background#53A1FA
  • scrollbar.shadow#101315
  • sideBar.background#14181b
  • sideBar.foreground#E0E0E0
  • sideBarSectionHeader.background#101315
  • sideBarSectionHeader.foreground#E0E0E0
  • statusBar.background#101315
  • statusBar.foreground#E0E0E0
  • statusBar.noFolderBackground#101315
  • tab.activeModifiedBorder#F9C35A
  • tab.inactiveBackground#3A434D44
  • tab.inactiveForeground#E0E0E088
  • tab.inactiveModifiedBorder#53A1FA
  • tab.unfocusedActiveModifiedBorder#F9C35A88
  • tab.unfocusedHoverBackground#4b4b4b
  • tab.unfocusedInactiveModifiedBorder#53A1FA88
  • titleBar.activeBackground#101315

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
constant.numeric,entity.other.keyframe-offset.percentage.css,keyword.other.unit,support.constant.dom,support.constant.property.math,support.constant.ext,support.constant.core,entity.name.function.preprocessor.c,constant.other.js,meta.at-rule.keyframes.scss entity.other.attribute-name.scss,constant,variable.other.enummember,constant.other.enum,entity.name.variable.enum-member,constant.language.infinity,text.log constant.language,meta.attribute.id.html entity.other.attribute-name.html,entity.other.attribute-name.id,entity.name.variable.preprocessor.symbol,variable.other.constant.object,#ffc16a
constant.other.character-class.regexp,constant.other.character-class.range.regexp,constant.other.character-class.set.regexp,support.constant,support.constant.math,support.constant.json,entity.other.attribute-name.id.css punctuation.definition.entity.css,#ffa600
constant.numeric.decimal.cpp#fa6450
keyword.operator.arithmetic.cpp#66c6fa
keyword.operator.logical.cpp, keyword.operator.comparison.cpp#e15dff
source.json meta.structure.dictionary.value.json string.quoted.double.json#98C379
variable.other.property.tsx#ce5d66
meta.body.function.definition#d6d6d6
constant.language.boolean#ae76fcbold
storage.type.built-in.primitive.cpp#f63780
entity.name.type.module,entity.name.package,variable.other.property,variable.other.object.property,variable.other.constant.property,entity.name.type.option,entity.name.label,variable.other.object.property.cs,entity.name.variable.tuple-element.cs,meta.object-literal.key,meta.object-literal.key string.quoted,variable.object.property,support.type.map.key,meta.at-rule.each.scss,meta.attribute.python,support.variable.dom,support.variable.property,support.variable.property.dom,storage.modifier.import,constant.other.php,entity.name.type.namespace,variable.other.member.c,meta.using-namespace-declaration.cpp entity.name.type.cpp,meta.class-struct-block.cpp meta.namespace-block.cpp entity.name.type.cpp,variable.other.source.dart,entity.name.namespace,entity.name.module,entity.name.type.result.rust,entity.name.scope-resolution.namespace,support.class.console,meta.use.rust,keyword.other.preprocessor.extension,entity.other.attribute-name.pseudo-element.css,entity.name.section.markdown,markup.heading,source.json meta.structure.dictionary.json > string.quoted.json,support.type.property-name.json,support.function.section.latex,support.function.general.tex,meta.object-literal.key punctuation.definition.string,#52dad3
entity.name.tag,entity.other.attribute-name.parent-selector.css punctuation.definition.entity.css,punctuation.definition.heading.markdown,support.function.general.tex punctuation.definition.function.tex,support.function.section.latex punctuation.definition.function.latex,punctuation.support.type.property-name.begin.json.comments,punctuation.support.type.property-name.end.json.comments,support.class.component,keyword.operator.optional,punctuation.section.embedded.begin.php,punctuation.section.embedded.end.php,punctuation.section.embedded.end.php source.php,string.regexp keyword.other,#E06C75
variable.parameter,token.variable.parameter,variable.other.jsdoc,variable.language.arguments,function.parameter,entity.name.variable.parameter,meta.function.c,punctuation.vararg-ellipses,variable.other.block.ruby,meta.arguments,entity.name.type.template,meta.type.parameters entity.name.type,meta.parameters,meta.function.parameter variable.other,variable.other.less,variable.other.sass,variable.scss,source.sass variable.other,variable.argument.css,variable.parameter.function.latex,variable.parameter.definition.label.latex,markup.bold.markdown,#E4BF7F
keyword.operator.negetion.regexp,keyword.control.anchor.regexp,punctuation.definition.group.capture.regexp,keyword.operator.quantifier.regexp,punctuation.definition.bold.markdown,#E4BF7F
comment#888888
variable.parameter.url,string,markup.inline.raw.string,text.html.vue-html meta.object-literal.key,meta.preprocessor.cs,text.html.vue-html meta.object-literal.key string.quoted,entity.other.attribute-name.class.css,selector.sass,entity.other.attribute-name.parent-selector.css,meta.at-rule.extend.scss,string.other.math.tex,support.constant.font-name,markup.inline.raw.markdown,markup.underline.link.markdown,markup.underline.link.image.markdown,#98C379
punctuation.definition.metadata.markdown,string.regexp,source.jsonmeta.structure.dictionary.json>value.json>string.quoted.json,source.jsonmeta.structure.array.json>value.json>string.quoted.json,source.jsonmeta.structure.dictionary.json>value.json>string.quoted.json>punctuation,source.jsonmeta.structure.array.json>value.json>string.quoted.json>punctuation,string.quoted source,punctuation.definition.entity.css,meta.attribute-selector.scss,string invalid.illegal,string.other.math.tex,punctuation.definition.string.begin.tex,punctuation.definition.string.end.tex,punctuation.definition.string,text.html.vue-html meta.object-literal.key punctuation.definition.string,string punctuation.attribute-shorthand.bind.html,string punctuation.attribute-shorthand.event.html,#98C379
comment.block.documentation, comment.block.documentation variable.other#888888
comment.block.documentation entity.name.type#1362bc
comment.block.documentation storage.type#E0E0E0
constant.numeric#F9C35A
constant.language#43AAF9
constant.character, constant.other#53A1FA
variable.language.this#43AAF9
keyword, keyword.operator.new, storage.modifier.async, keyword.operator.less#F4457Dbold
keyword.operator#EFEFEF
punctuation#666666
punctuation.definition.comment#888888
punctuation.definition.tag#b0b0b0
string.quoted punctuation.definition.string#666666
string.regexp, string.regexp punctuation.definition.string#5BD1B9
storage#43AAF9
storage.type#F4457Dbold
entity.name.class#53A1FA
entity.name.function, meta.require, support.function.any-method, variable.function, support.function.builtin.python, meta.function-call.generic.python#43AAF9bold
keyword.operator.assignment, keyword.operator.arithmetic, keyword.operator.bitwise, keyword.operator.relational, keyword.operator.increment, keyword.operator.decrement, keyword.operator.logical, keyword.operator.comparison, keyword.operator.ternary, keyword.operator.expression, storage.type.function.arrow.tsx#5d5c5cbold
variable.parameter#80ff9d
source.css.scss, source.css#5BD1B9
entity.other.attribute-name,invalid.deprecated.entity.other.attribute-name,entity.name.tag.custom.css,entity.name.tag.custom.scss,storage.type.java,entity.other.attribute-name.pseudo-class.css,support.type.property-name.media.css,support.constant.media.css,source.css.less entity.name.tag.custom.css,keyword.operator.gradient.css,entity.name.type,keyword.operator.expression,entity.other.inherited-class,entity.name.type.class,entity.name.scope-resolution,support.class,entity.name.type.interface,#56B7C3
support.function, support.variable.dom#F9C35A
support.constant#43AAF9
support.type#E0E0E0
support.class#5BD1B9
invalid#E34234
invalid.deprecated#E34234
invalid.illegal#E0E0E0
meta.diff, meta.diff.header#718493
markup.deleted#E61F44
markup.inserted#A6E22E
markup.changed#F9C35A
constant.numeric.line-number.find-in-files - match
entity.name.filename.find-in-files#E6DB74
keyword.other#9CAAB4
meta.property-value, support.constant.property-value, constant.other.color#9FBDE0
meta.property-value punctuation.separator.key-value#E0E0E0
keyword.other.use, keyword.other.function.use, keyword.other.namespace, keyword.other.new, keyword.other.special-method, keyword.other.unit, keyword.other.use-as#F4457D
meta.use support.class.builtin, meta.other.inherited-class support.class.builtin#F4457D
source.cpp variable.other#80ff9d
meta.object-literal.key#F4457D
variable.parameter.function.coffee#9FBDE0
markup.deleted.git_gutter#E61F44
markup.inserted.git_gutter
markup.changed.git_gutter#F9C35A
meta.template.expression#9FBDE0
variable.other.constant.property, keyword.operator.ternary, keyword.operator.expression.typeof#B267E6
entity.name.type, support.type.python#F9C35A
token.info-token#6796E6
token.warn-token#CD9731
token.error-token#F44747
token.debug-token#B267E6
entity.name.tag.tsx, entity.name.tag.js.jsx, entity.name.tag.html, entity.name.tag.xml, entity.name.tag.script.html.vue, entity.name.tag.template.html.vue, entity.name.tag.style.html.vue, entity.name.tag.style.html.vue, entity.name.tag.script.html, entity.name.tag.template.html, entity.name.tag.style.html, entity.name.tag.block.any.html#E06C75
support.class.component.tsx, support.class.component.jsx#ce5d66
support.type.primitive.tsx, support.type.primitive.ts#43AAF9
storage.modifier.tsx#F4457D
entity.other.inherited-class.tsx#F9C35A
meta.object.member variable.other.readwrite.tsx#E0E0E0
meta.structure.dictionary.json string.quoted.double.json#E0E0E0
meta.structure.dictionary.value.json string.quoted.double.json#5BD1B9
meta.structure.dictionary.json, punctuation.definition.string#5BD1B9
meta.structure.dictionary.json, support.type.property-name.json#E06C75
punctuation.definition.list.begin.markdown, punctuation.definition.list.begin.mdx, punctuation.definition.list.end.markdown, punctuation.definition.list.end.mdx, punctuation.definition.quote.begin.markdown, punctuation.definition.quote.begin.mdx, punctuation.definition.quote.end.markdown, punctuation.definition.quote.end.mdx, meta.separator.markdown, meta.separator.mdx, markup.inline.raw.string.markdown, markup.raw.code.text.mdx#F9C35A
entity.name.section.markdown, entity.name.section.mdx#53A1FA
punctuation.definition.heading.markdown, punctuation.definition.heading.mdx#F4457D
markup.raw.inline.markdown, markup.raw.inline.mdx#9FBDE0
punctuation.definition.bold.markdown, punctuation.definition.bold.mdx, punctuation.definition.italic.markdown, punctuation.definition.italic.mdx, punctuation.definition.entity#F4457D
punctuation.definition.string.begin.markdown, punctuation.definition.string.begin.mdx, punctuation.definition.string.end.markdown, punctuation.definition.string.end.mdx#F4457D
punctuation.definition.metadata.markdown, punctuation.definition.metadata.mdx#F4457D
markup.underline.link.markdown, markup.underline.link.image.markdown, string.other.link.destination.mdx, meta.image.inline.markdown, meta.image.inline.mdx#F4457D
markup.bold.markdown, string.other.strong.asterisk.mdx, markup.italic.markdown, markup.italic.mdx#F4457D
markup.italic.markdown, markup.italic.mdx
markup.bold.markdown, markup.bold.mdx
markup.raw.block.markdown, markup.raw.block.mdx#9FBDE0
keyword.other.rust#B267E6
keyword.other.fn.rust#F4457D
punctuation.section.embedded.begin.php, keyword.other.class.php#F4457D
support.class.php#E0E0E0
meta.use.php#5BD1B9
keyword.other.definition.ini#53A1FA
support.type.primitive.prisma#F9C35A
support.constant.constant.prisma#F4457D
variable.language.relations.prisma#5BD1B9
entity.name.tag.yaml#F4457D
storage.type.java#F9C35Abold
keyword.other.package.java, keyword.other.import.java#F4457Dbold
storage.modifier.package.java#F9C35A
storage.modifier.import.java#E0E0E0
punctuation.separator.java#EFEFEF
meta.tag.xml#43AAF9
keyword.other.declaration-specifier.swift, keyword.other.declaration-specifier.accessibility.swift#F4457Dbold
support.type.swift, meta.function-result.swift, variable.language.swift, keyword.operator.custom.infix.swift#53A1FA
variable.parameter.function.swift#E0E0E0
entity.name.function.swift#53A1FAbold
variable.parameter.function.swift, meta.parameter-clause.swift#E0E0E0
support.function.go#43AAF9bold
keyword.operator.address.go, keyword.operator.pointer.go#53A1FA
keyword.channel.go#B267E6
storage.type.numeric.go, storage.type.string.go, storage.type.error.go, storage.type.boolean.go, storage.type.byte.go, storage.type.uintptr.go, storage.type.error.go, storage.type.rune.go, storage.type.complex.go#F9C35A
Issaminu Theme by Issaminu - VS Code Theme