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.

  • activityBar.background#d5d4cd
  • activityBar.border#c2c1b780
  • activityBar.dropBackground#62b1cb40
  • activityBar.foreground#7a7971
  • activityBarBadge.background#3e91ac
  • activityBarBadge.foreground#e1f7ff
  • badge.background#3e91ac
  • badge.foreground#e1f7ff
  • breadcrumbPicker.background#e8e7e3
  • button.background#3e91ac
  • button.foreground#e1f7ff
  • button.hoverBackground#499fbc
  • debugExceptionWidget.background#e8e7e3
  • debugExceptionWidget.border#d5d4cd
  • debugToolBar.background#e8e7e3
  • debugToolBar.border#fafaf9
  • descriptionForeground#a5d8e9
  • diffEditor.insertedTextBackground#e1f7ff
  • diffEditor.insertedTextBorder#e1f7ff
  • diffEditor.removedTextBackground#e1f7ff
  • diffEditor.removedTextBorder#e1f7ff
  • dropdown.background#d5d4cd
  • dropdown.border#c2c1b7
  • dropdown.foreground#84740b
  • editor.background#fafaf9
  • editor.findMatchBackground#d5d4cd80
  • editor.findMatchHighlightBackground#c2c1b780
  • editor.foreground#7a7971
  • editor.hoverHighlightBackground#d5d4cd
  • editor.inactiveSelectionBackground#b1afa5
  • editor.lineHighlightBackground#e8e7e3
  • editor.rangeHighlightBackground#e8e7e3
  • editor.selectionBackground#e8e7e3
  • editor.selectionHighlightBackground#e8e7e3
  • editor.wordHighlightBackground#e8e7e3
  • editor.wordHighlightStrongBackground#e8e7e3
  • editorBracketMatch.background#fafaf9
  • editorBracketMatch.border#d5d4cd
  • editorCodeLens.foreground#7a7971
  • editorCursor.background#fafaf9
  • editorCursor.foreground#7dc2d9
  • editorError.foreground#36829b
  • editorGroup.background#b1afa5
  • editorGroup.border#fafaf9
  • editorGroup.dropBackground#c4b03140
  • editorGroupHeader.noTabsBackground#e8e7e3
  • editorGroupHeader.tabsBackground#e8e7e3
  • editorGroupHeader.tabsBorder#fafaf9
  • editorGutter.addedBackground#e9d76340
  • editorGutter.background#e8e7e364
  • editorGutter.deletedBackground#84740b
  • editorGutter.modifiedBackground#7dc2d9
  • editorHoverWidget.background#e8e7e3F2
  • editorHoverWidget.border#d5d4cdF2
  • editorIndentGuide.activeBackground#c2c1b780
  • editorIndentGuide.background#d5d4cd80
  • editorLineNumber.activeForeground#8d8c81
  • editorLineNumber.foreground#d5d4cdE6
  • editorMarkerNavigation.background#e8e7e3
  • editorMarkerNavigationError.background#e1f7ff
  • editorMarkerNavigationWarning.background#7dc2d9
  • editorOverviewRuler.commonContentForeground#62b1cb
  • editorOverviewRuler.currentContentForeground#62b1cb
  • editorOverviewRuler.incomingContentForeground#62b1cb
  • editorRuler.foreground#7a7971
  • editorSuggestWidget.background#e8e7e3
  • editorSuggestWidget.border#d5d4cd
  • editorSuggestWidget.foreground#7a7971
  • editorSuggestWidget.highlightForeground#b7a21a
  • editorSuggestWidget.selectedBackground#d5d4cd
  • editorWarning.foreground#7dc2d9
  • editorWhitespace.foreground#b1afa5
  • editorWidget.background#e8e7e3
  • editorWidget.border#d5d4cd
  • errorForeground#e1f7ff
  • extensionButton.prominentBackground#3e91ac
  • extensionButton.prominentForeground#e1f7ff
  • extensionButton.prominentHoverBackground#3e91ac
  • focusBorder#d5d4cd80
  • foreground#7a7971
  • gitDecoration.addedResourceForeground#2f7289
  • gitDecoration.conflictingResourceForeground#499fbc
  • gitDecoration.deletedResourceForeground#499fbc
  • gitDecoration.ignoredResourceForeground#d5d4cd
  • gitDecoration.modifiedResourceForeground#84740b
  • gitDecoration.untrackedResourceForeground#192d34
  • input.background#e8e7e3
  • input.border#d5d4cd
  • input.foreground#84740b
  • input.placeholderForeground#7a7971
  • inputOption.activeBorder#c4b031
  • inputValidation.errorBackground#e1f7ff
  • inputValidation.errorBorder#e1f7ff
  • inputValidation.infoBackground#fafaf9
  • inputValidation.infoBorder#a5d8e9
  • inputValidation.warningBackground#7dc2d9
  • inputValidation.warningBorder#7dc2d9
  • list.activeSelectionBackground#d5d4cd
  • list.activeSelectionForeground#84740b
  • list.dropBackground#c4b03140
  • list.errorForeground#62b1cb
  • list.focusBackground#e8e7e3
  • list.focusForeground#b7a21a
  • list.highlightForeground#b7a21a
  • list.hoverBackground#e8e7e3
  • list.hoverForeground#b7a21a
  • list.inactiveSelectionBackground#e8e7e3
  • list.inactiveSelectionForeground#508495
  • list.invalidItemForeground#62b1cb
  • list.warningForeground#62b1cb
  • merge.currentHeaderBackground#b1afa5
  • merge.incomingHeaderBackground#a5d8e9
  • meta.objectliteral.js#a5d8e9
  • notificationLink.foreground#c4b031
  • notifications.background#e8e7e3
  • notifications.foreground#36829b
  • panel.background#fafaf9
  • panel.border#d5d4cd
  • panel.dropBackground#62b1cb40
  • panelTitle.activeBorder#c2c1b7
  • panelTitle.activeForeground#7a7971
  • panelTitle.inactiveForeground#9f9d93
  • peekView.border#d5d4cd
  • peekViewEditor.background#e8e7e3
  • peekViewEditor.matchHighlightBackground#e1f7ff
  • peekViewResult.background#d5d4cd
  • peekViewResult.fileForeground#7a7971
  • peekViewResult.lineForeground#c2c1b7
  • peekViewResult.matchHighlightBackground#e1f7ff
  • peekViewResult.selectionBackground#e8e7e3
  • peekViewResult.selectionForeground#7a7971
  • peekViewTitle.background#d5d4cd
  • peekViewTitleDescription.foreground#9f9d93
  • peekViewTitleLabel.foreground#8d8c81
  • pickerGroup.border#fafaf9
  • pickerGroup.foreground#36829b
  • progress.background#b1afa5
  • progressBar.background#7dc2d9
  • punctuation.definition.generic.begin.html#62b1cb
  • scrollbar.shadow#fafaf9
  • scrollbarSlider.activeBackground#c2c1b7
  • scrollbarSlider.background#e8e7e3
  • scrollbarSlider.hoverBackground#d5d4cd
  • selection.background#7dc2d9
  • sideBar.background#fafaf9
  • sideBar.border#d5d4cd80
  • sideBar.dropBackground#62b1cb40
  • sideBar.foreground#7ba8b7
  • sideBarSectionHeader.background#e8e7e3
  • sideBarSectionHeader.foreground#7a7971
  • sideBarTitle.foreground#7a7971
  • source.elm#b1afa5
  • statusBar.background#d5d4cd
  • statusBar.border#c2c1b780
  • statusBar.debuggingBackground#fafaf9
  • statusBar.debuggingBorder#fafaf9
  • statusBar.foreground#9f9d93
  • statusBar.noFolderBackground#fafaf9
  • statusBar.noFolderBorder#e8e7e3
  • statusBarItem.activeBackground#b1afa5
  • statusBarItem.hoverBackground#c2c1b7
  • statusBarItem.prominentBackground#e8e7e3
  • statusBarItem.prominentHoverBackground#e8e7e3
  • string.quoted.single.js#84740b
  • tab.activeBackground#fafaf9
  • tab.activeBorder#fafaf9
  • tab.activeForeground#7a7971
  • tab.border#fafaf9
  • tab.hoverBackground#fafaf9
  • tab.inactiveBackground#e8e7e3
  • tab.inactiveForeground#b1afa5
  • tab.unfocusedActiveBorder#9f9d93
  • tab.unfocusedActiveForeground#c2c1b7
  • tab.unfocusedInactiveForeground#c2c1b7
  • terminal.ansiBlack#e8e7e3
  • terminal.ansiBlue#499fbc
  • terminal.ansiBrightBlack#b1afa5
  • terminal.ansiBrightBlue#8d8c81
  • terminal.ansiBrightCyan#7a7971
  • terminal.ansiBrightGreen#b1afa5
  • terminal.ansiBrightMagenta#62b1cb
  • terminal.ansiBrightRed#8d8c81
  • terminal.ansiBrightWhite#36829b
  • terminal.ansiBrightYellow#9f9d93
  • terminal.ansiCyan#c4b031
  • terminal.ansiGreen#c4b031
  • terminal.ansiMagenta#3e91ac
  • terminal.ansiRed#36829b
  • terminal.ansiWhite#36829b
  • terminal.ansiYellow#36829b
  • terminal.background#fafaf9
  • terminal.foreground#b1afa5
  • terminalCursor.background#fafaf9
  • terminalCursor.foreground#a5d8e9
  • textLink.activeForeground#c4b031
  • textLink.foreground#c4b031
  • titleBar.activeBackground#fafaf9
  • titleBar.activeForeground#a5d8e9
  • titleBar.inactiveBackground#fafaf9
  • walkThrough.embeddedEditorBackground#fafaf9
  • welcomePage.buttonBackground#e8e7e380
  • welcomePage.buttonHoverBackground#e8e7e3
  • widget.shadow#b1afa5

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#7a7971italic
meta.embedded, source.groovy.embedded#7a7971
comment, punctuation.definition.comment#c2c1b7italic
variable, string constant.other.placeholder#e1f7ff
constant.other.color#e1f7ff
invalid, invalid.illegal#e1f7ff
keyword, punctuation.accessor, storage.type#84740b
storage.modifier, constant.keyword.clojure#b7a21a
punctuation, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, meta.function punctuation.separator.comma, punctuation.definition.string, punctuation.definition.parameters, punctuation.terminator.expression, punctuation.definition.arguments, punctuation.definition.array, punctuation.section.array, punctuation.definition.list.begin, punctuation.definition.list.end, punctuation.separator.arguments, punctuation.definition.list, meta.array, source.elixir punctuation.definition.string, string.quoted.double.json punctuation.definition.string.json#c2c1b7
keyword.control, constant.other.color, keyword.other.template, keyword.other.substitution#b7a21a
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#8d8c81
meta.function-call, variable.function, support.function, keyword.other.debugger, keyword.other.special-method, entity.name.function.clojure#8d8c81
meta.block variable.other#7a7971
support.other.variable, string.other.link#84740b
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other#978611
constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#3e91acnormal
entity.name, support.type, support.class, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types#9f9d93
support.type#c4b031
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name#b7a21a
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#8d8c81
variable.other.global.safer.php#499fbc
variable.language#84740bitalic
entity.name.method.js#36829bitalic
meta.class-method.js entity.name.function.js, variable.function.constructor, keyword.control.conditional.js, keyword.control.conditional.ts, keyword.control.switch.js, keyword.control.switch.ts#c4b031
storage.type.function.arrow.js, storage.type.function.arrow.js.jsx, storage.type.function.arrow.ts, storage.type.function.arrow.tsx, storage.type.function.arrow.coffee, keyword.operator.assignment, keyword.operator.comparison#84740b
entity.name.function.go, source.go keyword.control.loop.go#8d8c81
meta.class.ts entity.name.type.class, meta.class.tsx entity.name.type.class, meta.class meta.function-call variable.function.ts, meta.class meta.function-call variable.function.tsx, source.ts keyword.control.loop.ts, source.tsx keyword.control.loop.tsx, source.ts meta.interface.ts entity.name.type.interface.ts, source.tsx meta.interface.tsx entity.name.type.interface.tsx, source.ts meta.type.declaration.ts entity.name.type.ts, source.tsx meta.type.declaration.tsx entity.name.type.tsx#8d8c81
meta.method.identifier.java entity.name.function.java, meta.method.identifier.java storage.type.generic.java, meta.class meta.function-call variable.function.java, source.java keyword.control.loop.java, storage.type.function.arrow.java, meta.class.identifier.java entity.name.type.class.java#8d8c81
meta.method.identifier.cs entity.name.function.cs, meta.method.identifier.cs storage.type.generic.cs, meta.class meta.function-call variable.function.cs, source.cs keyword.control.loop.cs, storage.type.function.arrow.cs, meta.class.identifier.cs entity.name.type.class.cs, source.cs entity.name.function.cs, source.cs entity.name.type.class.cs#8d8c81
source.elixir entity.name.function.elixir, entity.name.type.module.elixir#8d8c81
keyword.control.flow.js, keyword.control.flow.js.jsx, keyword.control.trycatch.js, keyword.control.trycatch.js.jsx, source.js meta.group.braces.curly.js keyword.control.loop.js, source.js.jsx meta.group.braces.curly.js.jsx keyword.control.loop.js.jsx, source.js meta.export.default.js keyword.control.default.js, source.js.jsx meta.export.default.js.jsx keyword.control.default.js.jsx, keyword.control.switch.js, keyword.control.switch.js.jsx#84740b
keyword.control.flow.coffee, keyword.control.trycatch.coffee, source.coffee meta.group.braces.curly.coffee keyword.control.loop.coffee, source.coffee meta.export.default.coffee keyword.control.default.coffee, keyword.control.switch.coffee#84740b
keyword.control.flow.ts, keyword.control.flow.tsx, keyword.control.trycatch.ts, keyword.control.trycatch.tsx, source.ts meta.group.braces.curly.ts keyword.control.loop.ts, source.tsx meta.group.braces.curly.tsx keyword.control.loop.tsx, source.ts meta.export.default.ts keyword.control.default.ts, source.tsx meta.export.default.tsx keyword.control.default.tsx, keyword.control.switch.ts, keyword.control.switch.tsx#84740b
keyword.control.flow.php, keyword.control.trycatch.php, source.php meta.group.braces.curly.php keyword.control.loop.php, keyword.control.switch.php#84740b
source.shell meta.scope.while-loop.shell keyword.control.shell, source.shell meta.scope.for-in-loop.shell keyword.control.shell#84740bitalic
source.shell meta.scope.while-loop.shell meta.scope.if-block.shell keyword.control.shell, source.shell meta.scope.for-in-loop.shell meta.scope.if-block.shell keyword.control.shell#84740bitalic
keyword.control.flow.java, keyword.control.trycatch.java, source.java meta.group.braces.curly.java keyword.control.loop.java, keyword.control.switch.java#84740b
source.cs keyword.control.flow, keyword.control.trycatch.cs, source.cs meta.group.braces.curly.cs keyword.control.loop.cs, source.cs keyword.control.switch.cs#84740b
keyword.control.elixir#84740bitalic
keyword.control.java#84740bitalic
meta.tag.preprocessor.xml#84740b
meta.tag.preprocessor.xml entity.other.attribute-name#b1afa5
keyword.operator.assignment#84740b
keyword.operator.logical.js, keyword.operator.logical.js.jsx#84740b
keyword.operator.logical.coffee#84740b
keyword.operator.logical.ts, keyword.operator.logical.tsx#84740b
source.go keyword.operator.assignment.go#84740bnormal
source.php keyword.operator, punctuation.separator.inheritance.php#84740b
source.shell meta.scope.logical-expression.shell#84740b
entity.other.attribute-name#499fbcitalic
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#c4b031
text.html.basic#36829b
entity.other.attribute-name.class#2f7289
source.sass keyword.control#36829b
markup.inserted#7a7971
markup.deleted#8d8c81italic
markup.deleted.diff#8d8c81
markup.inserted.diff#7a7971italic
markup.changed#499fbcitalic
string.regexp#c4b031
constant.character.escape#c4b031
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#8d8c81italic
source.js constant.other.object.key.js string.unquoted.label.js#8d8c81italic
support.type.property-name.json#36829b
support.constant.json#7a7971
meta.structure.dictionary.value.json string.quoted.double#b7a21a
meta.structure.dictionary.json meta.structure.dictionary.value constant.language#84740b
source.json meta.structure.dictionary.json support.type.property-name.json#8d8c81
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#3e91ac
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#499fbc
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#499fbc
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#3e91ac
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#36829b
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#8d8c81
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#8d8c81
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#8d8c81
text.html.markdown, punctuation.definition.list_item.markdown#8d8c81
beginning.punctuation.definition.list.markdown#84740b
text.html.markdown markup.inline.raw.markdown#499fbc
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#8d8c81
text.html.markdown meta.dummy.line-break
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown, markup.heading1, markup.heading.markdown, entity.name, entity.name.section.markdown, heading.1.markdown#84740b
markup.heading.markdown punctuation.definition.heading.markdown#36829b
markup.italic.markdownitalic
markup.bold, markup.bold string#8d8c81bold
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string#8d8c81bold
markup.underline#36829bunderline
markup.strikestrike
markup.quote punctuation.definition.blockquote.markdown#fafaf9
markup.quote.markdown#36829bitalic
beginning.punctuation.definition.quote.markdown#84740b
meta.paragraph.markdown#8d8c81
punctuation.definition.bold.markdown, punctuation.definition.italic.markdown#3e91ac
markup.quoteitalic
string.other.link.title.markdown#84740b
markup.underline.link.markdown#3e91ac
string.other.link.description.title.markdown#499fbc
constant.other.reference.link.markdown#9f9d93
markup.raw.block#499fbc
markup.raw.block.fenced.markdown#fafaf950
punctuation.definition.fenced.markdown#fafaf950
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#8d8c81
variable.language.fenced.markdown#8d8c81
meta.separator#8d8c81bold
markup.table#8d8c81
token.info-token#3e91ac
token.warn-token#8d8c81
token.error-token#8d8c81
token.debug-token#499fbc
string, string.quoted#2f7289
meta.attribute-selector.css entity.other.attribute-name.attribute, variable.other.readwrite.js#3e91ac
support.constant.math#7a7971
string.regexp#7a7971
constant.numeric, constant.character.numeric#2f7289
variable.language, variable.other#84740b
variable.language.this.js, variable.language.this.php#84740bitalic
keyword#7a7971italic
storage, meta.var.expr, meta.class meta.method.declaration meta.var.expr storage.type.js, storage.type.property.js, storage.type.property.ts, storage.type.property.tsx#978611italic
storage.type.class.js#84740b
entity.name.class, meta.class entity.name.type.class#36829b
entity.name.type#7a7971
entity.name.function#8d8c81
punctuation.definition.variable#7a7971
punctuation.section.embedded.begin, punctuation.section.embedded.end#c2c1b7
constant.language, punctuation.definition.constant, variable.other.constant, meta.preprocessor#7a7971
support.function.construct, keyword.other.new#978611
constant.character, constant.other#84740b
constant.character.escape#8d8c81
string.regexp, string.regexp keyword.other#8d8c81
entity.other.inherited-class#36829b
entity.name.tag#84740b
punctuation.definition.tag, meta.tag#9f9d93
entity.name.tag, meta.tag.other.html, meta.tag.other.js, meta.tag.other.tsx, entity.name.tag.tsx, entity.name.tag.js, entity.name.tag, meta.tag.js, meta.tag.tsx, meta.tag.html#84740b
entity.other.attribute-name#84740bitalic
entity.name.tag.custom#3e91ac
support.function#3e91ac
punctuation.separator.continuation#84740b
invalid.broken#fafaf9
invalid.unimplemented#84740b
invalid.illegal#84740b
support.type, support.class#c4b031
support.variable.dom#84740b
support.type.exception#8d8c81
support.other.variable
invalid#84740b
invalid.deprecated#84740b
keyword.operator#b7a21anormal
keyword.operator.relational#499fbcitalic
keyword.operator.assignment#84740b
keyword.operator.arithmetic#499fbc
keyword.operator.bitwise#499fbc
keyword.operator.increment#499fbc
keyword.operator.ternary#499fbc
comment.line.double-slash#b1afa5
object#3e91ac
constant.language.null#7a7971
meta.brace#b1afa5
meta.delimiter.period#36829bitalic
constant.language.boolean#c4b031
object.comma#7a7971
variable.parameter.function#c4b031
support.type.vendor.property-name, support.constant.vendor.property-value, support.type.property-name, meta.property-list entity.name.tag#9f9d93
meta.property-list entity.name.tag.reference#3e91ac
constant.other.color.rgb-value punctuation.definition.constant#8d8c81
meta.selector#499fbcitalic
entity.other.attribute-name.id#b7a21a
meta.property-name#c4b031
entity.name.tag.doctype, meta.tag.sgml.doctype#b1afa5italic
keyword.control.operator#c4b031
keyword.operator.logical#499fbc
variable.instance, variable.other.instance, variable.readwrite.instance, variable.other.readwrite.instance, variable.other.property#3e91ac
variable.other.object.property#36829bitalic
meta.function-call.js.jsx entity.name.function.js.jsx#499fbc
variable.other.object.js, variable.other.object.jsx, variable.object.property.js, variable.object.property.jsx#36829b
keyword.operator.comparison, keyword.control.flow.js, keyword.control.flow.ts, keyword.control.flow.tsx, keyword.control.ruby, keyword.control.module.ruby, keyword.control.class.ruby, keyword.control.def.ruby, keyword.control.loop.js, keyword.control.loop.ts, keyword.control.import.js, keyword.control.import.ts, keyword.control.import.tsx, keyword.control.from.js, keyword.control.from.ts, keyword.control.from.tsx#84740bitalic
variable.interpolation#7a7971
support.variable.property#c4b031
string.template meta.template.expression#7a7971
string.template punctuation.definition.string#36829b
italic#499fbcitalic
bold#7a7971bold
quote#b1afa5italic
raw#7a7971
variable.assignment.coffee#c4b031
variable.parameter.function.coffee#36829b
variable.assignment.coffee#7a7971
variable.other.readwrite.cs#36829b
entity.name.type.class.cs, storage.type.cs#36829b
entity.name.type.namespace.cs#7a7971
entity.name.tag.css, entity.name.tag.less, entity.name.tag.custom.css, support.constant.property-value.css#2f7289
entity.name.tag.wildcard.css, entity.name.tag.wildcard.less, entity.name.tag.wildcard.scss, entity.name.tag.wildcard.sass#2f7289
keyword.other.unit.css, keyword.other.unit.px.css, keyword.other.unit.vw.css, keyword.other.unit.vh.css, keyword.other.unit.ch.css, keyword.other.unit.ex.css, keyword.other.unit.percentage.css, keyword.other.unit.rem.css, keyword.other.unit.em.css#499fbc
keyword.control.at-rule.media.css#978611
entity.other.attribute-name.id, punctuation.definition.entity.css#84740b
source.elixir support.type.elixir, source.elixir meta.module.elixir entity.name.class.elixir#36829b
source.elixir entity.name.function#7a7971
source.elixir constant.other.symbol.elixir, source.elixir constant.other.keywords.elixir#3e91ac
source.elixir variable.other.readwrite.module.elixir, source.elixir variable.other.readwrite.module.elixir punctuation.definition.variable.elixir#7a7971
source.elixir .punctuation.binary.elixir#499fbcitalic
source.go meta.function-call.go#7a7971
source.go keyword.package.go, source.go keyword.import.go, source.go keyword.function.go, source.go keyword.type.go, source.go keyword.struct.go, source.go keyword.interface.go, source.go keyword.const.go, source.go keyword.var.go, source.go keyword.map.go, source.go keyword.channel.go, source.go keyword.control.go#499fbcitalic
source.go constant.language.go, source.go constant.other.placeholder.go#7a7971
meta.class entity.name.type.class, entity.global.clojure#2f7289
meta.method.declaration storage.type.js, meta.symbol.clojure#3e91ac
terminator.js#36829b
meta.js punctuation.definition.js#36829b
entity.name.type.instance.jsdoc, entity.name.type.instance.phpdoc#b1afa5
variable.other.jsdoc, variable.other.phpdoc#c4b031
variable.other.meta.import.js, meta.import.js variable.other, variable.other.meta.export.js, meta.export.js variable.other#36829b
variable.parameter.function.js#36829b
variable.js, variable.other.js#36829b
entity.name.type.js, entity.name.type.module.js#c4b031
support.class.js#36829b
variable.other.ruby#36829b
entity.name.type.class.ruby#499fbc
constant.language.symbol.hashkey.ruby#36829b
meta.attribute-selector.less entity.other.attribute-name.attribute#3e91ac
variable.other.php, variable.other.property.php#36829b
support.class.php#499fbc
meta.function-call.php punctuation#36829b
variable.other.global.php#499fbc
variable.other.global.php punctuation.definition.variable#499fbc
constant.language.python#499fbc
variable.parameter.function.python, meta.function-call.arguments.python#36829b
meta.function-call.python, meta.function-call.generic.python#36829b
punctuation.python#36829b
entity.name.function.decorator.python#7a7971
source.python variable.language.special#36829b
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass#3e91ac
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable#7a7971
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute#36829b
entity.name.tag.scss, entity.name.tag.sass#7a7971
keyword.other.unit.scss, keyword.other.unit.sass#978611
variable.other.readwrite.alias.ts, variable.other.readwrite.alias.tsx, variable.other.readwrite.ts, variable.other.readwrite.tsx, variable.other.object.ts, variable.other.object.tsx, variable.object.property.ts, variable.object.property.tsx, variable.other.ts, variable.other.tsx, variable.tsx, variable.ts#36829b
entity.name.type.ts, entity.name.type.tsx#36829b
support.class.node.ts, support.class.node.tsx#36829b
meta.type.parameters.ts entity.name.type, meta.type.parameters.tsx entity.name.type#b1afa5
meta.import.ts punctuation.definition.block, meta.import.tsx punctuation.definition.block, meta.export.ts punctuation.definition.block, meta.export.tsx punctuation.definition.block#36829b
meta.decorator punctuation.decorator.ts, meta.decorator punctuation.decorator.tsx#36829b
meta.tag.js meta.jsx.children.tsx#36829b
entity.name.tag.yaml#36829b
variable.other.readwrite.js, variable.parameter#3e91ac
support.class.component.js, support.class.component.tsx#2f7289
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#36829b
entity.name.type.tsx, entity.name.type.module.tsx#c4b031
meta.method.declaration storage.type.ts, meta.method.declaration storage.type.tsx#3e91ac
meta.diff, meta.diff.header#36829bitalic
markup.deleted#36829b
markup.changed#36829b
markup.inserted#36829b
markup.quote#8d8c81italic
markup.list#36829b
markup.bold, markup.italic#36829b
markup.inline.raw#84740b
markup.heading.setext#3e91ac

Shiki preview

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

Loading...

Base2tone VSCode Themes - Coding Theme