Skip to main content
Coding Theme

Color themes

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.

  • actionBar.toggledBackground#383a49
  • activityBar.background#1c1d1c
  • activityBarBadge.background#16825d
  • checkbox.border#6b6b6b
  • editor.background#1c1d1c
  • editor.foreground#d4d4d4
  • editor.inactiveSelectionBackground#1f2f2ca0
  • editor.selectionBackground#1f2f2c
  • editor.selectionHighlightBackground#add6ff26
  • editorCursor.foreground#a0d0b0
  • editorIndentGuide.activeBackground1#707070
  • editorIndentGuide.background1#404040
  • input.placeholderForeground#a6a6a6
  • list.activeSelectionIconForeground#ffffff
  • list.dropBackground#383B3d
  • menu.background#252526
  • menu.border#454545
  • menu.foreground#cccccc
  • menu.selectionBackground#16825d
  • menu.separatorBackground#454545
  • ports.iconRunningProcessForeground#369432
  • sideBar.background#1c1d1c
  • sideBarSectionHeader.background#1c1d1c
  • sideBarSectionHeader.border#1c1d1c
  • sideBarTitle.foreground#696f69
  • statusBar.background#2f2f2f
  • statusBarItem.remoteBackground#16825d
  • statusBarItem.remoteForeground#ffffff
  • tab.lastPinnedBorder#cccccc
  • tab.selectedBackground#222222
  • tab.selectedForeground#ffffffa0
  • widget.border#303031

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
keyword, keyword.type, keyword.type.zig, keyword.control, keyword.operator.delete, keyword - keyword.operator, keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.alignof, keyword.operator.typeid, keyword.operator.alignas, keyword.operator.instanceof, keyword.operator.logical.python, keyword.operator.wordlike, keyword.operator.sizeof.cpp, keyword.operator.sizeof.c, keyword.operator.noexcept, keyword.operator.expression, keyword.operator.expression.typeof, keyword.operation.graphql, keyword.operator.new.ts, keyword.operator.new.tsx, keyword.on.graphql, keyword.directive.preprocessor.glsl, keyword.fragment.graphql, keyword.other.important.css, keyword.other.new.cs, keyword.other.typedef.c, keyword.other.using, keyword.other.directive.using, keyword.other.operator, variable.language, variable.language.wildcard.java, variable.language.this.ts, variable.language.this.tsx, storage, storage.type, storage.modifier, storage.modifier.glsl, storage.modifier.c, storage.modifier.import.java, storage.modifier.package.java, entity.name.operator, support.variable.property.importmeta.tsx, support.variable.jai, this.self#7d9da3
entity.name.function.preprocessor, entity.name.function.preprocessor.c, meta.preprocessor, meta.preprocessor.macro.c#aa88aa
entity.name.tag, entity.name.tag.css, entity.name.tag.less, entity.name.section.markdown, entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, entity.other.attribute-name.parent-selector.css, entity.other.attribute-name.parent.less, entity.other.attribute-name.pseudo-element.css, entity.other.attribute-name.scss, source.css entity.other.attribute-name.class, source.css entity.other.attribute-name.pseudo-class, source.css.less entity.other.attribute-name.id, meta.selector.css, keyword.operator.expression.void, variable.language.relations.prisma#6faf8a
entity.name.type, entity.name.class, entity.name.namespace, entity.name.enum.jai, entity.name.struct.jai, entity.other.attribute, entity.name.scope-resolution, entity.other.inherited-class, support.type, support.class, support.constant.math, support.constant.dom, support.constant.json, storage.type.numeric.go, storage.type.byte.go, storage.type.boolean.go, storage.type.string.go, storage.type.uintptr.go, storage.type.error.go, storage.type.rune.go, storage.type.cs, storage.type.jai, storage.type.struct.jai, storage.type.generic.cs, storage.type.modifier.cs, storage.type.variable.cs, storage.type.annotation.java, storage.type.generic.java, storage.type.java, storage.type.object.array.java, storage.type.primitive.array.java, storage.type.primitive.java, storage.type.token.java, storage.type.groovy, storage.type.annotation.groovy, storage.type.parameters.groovy, storage.type.generic.groovy, storage.type.object.array.groovy, storage.type.primitive.array.groovy, storage.type.primitive.groovy, meta.type.cast.expr, meta.type.new.expr#6faf8a
entity.name.function, entity.name.function.c, support.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal, keyword.other.main.jai#ddbb77
variable, variable.css, variable.other.constant, entity.name.variable, entity.other.attribute-name, entity.name.fragment.graphql, entity.name.label, source.glsl, source.css variable, source.coffee.embedded, meta.function.c, meta.object-literal.key, meta.definition.variable.name, meta.structure.dictionary.key.python, support.type.property-name, support.type.vendored.property-name, support.variable, support.variable.property.ts, support.variable.glsl, support.constant.property-value, support.constant.font-name, support.constant.media-type, support.constant.media, support.constant.color, constant.other.color.rgb-value, constant.other.rgb-value, constant.character.escape, constant.character, constant.other.option#a0a088
variable.other.enummember, variable.enum.jai, meta.property-value.css, support.constant.property-value.css, support.constant.font-name.css, support.constant.constant.prisma#91ab62
string, string.tag, string.value, constant.numeric, constant.language, constant.language.null, constant.language.undefined, constant.language.boolean, constant.language.json, constant.language.json.comments, constant.regexp, meta.jsx.children.tsx, meta.embedded.assembly, meta.preprocessor.string, meta.preprocessor.numeric, punctuation.definition.constant.css, keyword.other.unit, punctuation.definition.string.import.begin.jai#ce9178
comment, punctuation.definition.comment, punctuation.definition.heading.markdown, meta.paragraph.markdown, text.html.markdown#696f69
punctuation, punctuation.section.embedded, punctuation.accessor.optional, punctuation.definition.parameters, punctuation.definition.binding-pattern, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.definition.tag, punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php, meta.parens.block, meta.brace.round, meta.brace.square, keyword.operator.arithmetic, keyword.operator.bitwise, keyword.operator, keyword.operator.comparison, keyword.operator.logical, keyword.operator.increment, keyword.operator.assignment, keyword.operator.jai, keyword.declaration.jai, storage.modifier.array.bracket.square, storage.type.function.arrow, constant.other.placeholder, constant.language.import-export-all, source.zig, source.prisma.array, source.prisma.attribute.with_arguments, punctuation.section.braces.start.jai, punctuation.section.braces.end.jai#919f89
emphasisitalic
strongbold
header#000080
invalid#f44747
markup.underlineunderline
markup.bold#569cd6bold
markup.heading#569cd6bold
markup.italicitalic
markup.strikethroughstrikethrough
markup.inserted#b5cea8
markup.deleted#ce9178
markup.changed#569cd6
punctuation.definition.quote.begin.markdown#6a9955
punctuation.definition.list.begin.markdown#6796e6
markup.inline.raw#ce9178
meta.diff.header#569cd6
support.function.git-rebase#9cdcfe
constant.sha.git-rebase#b5cea8
variable.parameter.jai#d0c5a0

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Core - Coding Theme