Skip to main content
CodingTheme

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#d1c7d0
  • activityBar.border#c7bcc6
  • activityBar.dropBackground#dbd2da
  • activityBar.foreground#363035
  • activityBarBadge.background#dd40cb
  • activityBarBadge.foreground#ffe6fc
  • badge.background#dd40cb
  • badge.foreground#ffe6fc
  • breadcrumbPicker.background#f9f6f8
  • button.background#dd40cb
  • button.foreground#ffe6fc
  • button.hoverBackground#dd40cb
  • debugExceptionWidget.background#f9f6f8
  • debugExceptionWidget.border#f9f6f8
  • debugToolBar.background#ede8ed
  • descriptionForeground#201d20
  • diffEditor.insertedTextBackground#8a2ac6
  • diffEditor.insertedTextBorder#8a2ac6
  • diffEditor.removedTextBackground#8a2ac6
  • diffEditor.removedTextBorder#8a2ac6
  • dropdown.background#ede8ed
  • dropdown.border#d1c7d0
  • dropdown.foreground#201d20
  • editor.background#ede8ed
  • editor.findMatchBackground#766b75
  • editor.findMatchHighlightBackground#8b7e89
  • editor.foreground#150413
  • editor.hoverHighlightBackground#d1c7d0
  • editor.inactiveSelectionBackground#9e949d
  • editor.lineHighlightBackground#e4dde3
  • editor.rangeHighlightBackground#dbd2da
  • editor.selectionBackground#dbd2da
  • editor.selectionHighlightBackground#dbd2da
  • editor.wordHighlightBackground#d1c7d0
  • editor.wordHighlightStrongBackground#d1c7d0
  • editorBracketMatch.background#f9f6f8
  • editorBracketMatch.border#dbd2da
  • editorCodeLens.foreground#6b616a
  • editorCursor.background#f9f6f8
  • editorCursor.foreground#afa8b3
  • editorError.foreground#b15925
  • editorGroup.background#9e949d
  • editorGroup.border#f9f6f8
  • editorGroup.dropBackground#9e42d7
  • editorGroupHeader.noTabsBackground#e4dde3
  • editorGroupHeader.tabsBackground#e4dde3
  • editorGroupHeader.tabsBorder#f9f6f8
  • editorGutter.addedBackground#8a2ac6
  • editorGutter.background#e4dde3
  • editorGutter.deletedBackground#a05022
  • editorGutter.modifiedBackground#a82435
  • editorHoverWidget.background#f9f6f8
  • editorHoverWidget.border#f9f6f8
  • editorIndentGuide.activeBackground#dbd2da
  • editorIndentGuide.background#d1c7d0
  • editorLineNumber.activeForeground#6b616a
  • editorLineNumber.foreground#bdb2bc
  • editorMarkerNavigation.background#d1c7d0
  • editorMarkerNavigationError.background#f2b28c
  • editorMarkerNavigationWarning.background#f5a3ae
  • editorOverviewRuler.commonContentForeground#a82435
  • editorOverviewRuler.currentContentForeground#a82435
  • editorOverviewRuler.incomingContentForeground#a82435
  • editorRuler.foreground#6b616a
  • editorSuggestWidget.background#e4dde3
  • editorSuggestWidget.border#f9f6f8
  • editorSuggestWidget.foreground#6b616a
  • editorSuggestWidget.highlightForeground#8a2ac6
  • editorSuggestWidget.selectedBackground#f9f6f8
  • editorWarning.foreground#a82435
  • editorWhitespace.foreground#9e949d
  • editorWidget.background#f9f6f8
  • editorWidget.border#f9f6f8
  • errorForeground#c26129
  • extensionButton.prominentBackground#8a2ac6
  • extensionButton.prominentForeground#f9f6f8
  • extensionButton.prominentHoverBackground#8a2ac6
  • focusBorder#9e42d7
  • foreground#150413
  • gitDecoration.addedResourceForeground#8a2ac6
  • gitDecoration.conflictingResourceForeground#a82435
  • gitDecoration.deletedResourceForeground#c26129
  • gitDecoration.ignoredResourceForeground#d1c7d0
  • gitDecoration.modifiedResourceForeground#9e42d7
  • gitDecoration.untrackedResourceForeground#201d20
  • input.background#d1c7d0
  • input.border#8b7e89
  • input.foreground#201d20
  • input.placeholderForeground#6b616a
  • inputOption.activeBorder#9e42d7
  • inputValidation.errorBackground#c26129
  • inputValidation.errorBorder#c26129
  • inputValidation.infoBackground#ede8ed
  • inputValidation.infoBorder#a82435
  • inputValidation.warningBackground#a82435
  • inputValidation.warningBorder#a82435
  • list.activeSelectionBackground#dbd2da
  • list.activeSelectionForeground#0d070c
  • list.dropBackground#e4dde3
  • list.errorForeground#c26129
  • list.focusBackground#dbd2da
  • list.focusForeground#201d20
  • list.highlightForeground#9e42d7
  • list.hoverBackground#dbd2da
  • list.hoverForeground#201d20
  • list.inactiveSelectionBackground#d1c7d0
  • list.inactiveSelectionForeground#6b616a
  • list.invalidItemForeground#a82435
  • list.warningForeground#c26129
  • merge.currentHeaderBackground#9e949d
  • merge.incomingHeaderBackground#a82435
  • meta.objectliteral.js#a82435
  • notificationLink.foreground#9e42d7
  • notifications.background#f9f6f8
  • notifications.foreground#201d20
  • panel.background#ede8ed
  • panel.border#f9f6f8
  • panel.dropBackground#9e42d7
  • panelTitle.activeBorder#a82435
  • panelTitle.activeForeground#0d070c
  • panelTitle.inactiveForeground#8b7e89
  • peekView.border#9e949d
  • peekViewEditor.background#d1c7d0
  • peekViewEditor.matchHighlightBackground#a82435
  • peekViewResult.background#d1c7d0
  • peekViewResult.fileForeground#d1c7d0
  • peekViewResult.lineForeground#d1c7d0
  • peekViewResult.matchHighlightBackground#0d070c
  • peekViewResult.selectionBackground#dbd2da
  • peekViewResult.selectionForeground#9e949d
  • peekViewTitle.background#e4dde3
  • peekViewTitleDescription.foreground#9e949d
  • peekViewTitleLabel.foreground#9e949d
  • pickerGroup.border#f9f6f8
  • pickerGroup.foreground#201d20
  • progress.background#9e949d
  • progressBar.background#dd40cb
  • punctuation.definition.generic.begin.html#a82435
  • scrollbar.shadow#766b75
  • scrollbarSlider.activeBackground#bdb2bc
  • scrollbarSlider.background#d1c7d0
  • scrollbarSlider.hoverBackground#c7bcc6
  • selection.background#dd40cb
  • sideBar.background#ede8ed
  • sideBar.border#e4dde3
  • sideBar.foreground#766b75
  • sideBarSectionHeader.background#dbd2da
  • sideBarSectionHeader.foreground#6b616a
  • sideBarTitle.foreground#564e55
  • source.elm#9e949d
  • statusBar.background#b3a8b2
  • statusBar.border#bdb2bc
  • statusBar.debuggingBackground#a99ea7
  • statusBar.debuggingBorder#9e949d
  • statusBar.foreground#60575f
  • statusBar.noFolderBackground#ede8ed
  • statusBar.noFolderBorder#d1c7d0
  • statusBarItem.activeBackground#9e949d
  • statusBarItem.hoverBackground#9e949d
  • statusBarItem.prominentBackground#dbd2da
  • statusBarItem.prominentHoverBackground#d1c7d0
  • string.quoted.single.js#6d1763
  • tab.activeBackground#ede8ed
  • tab.activeBorder#ede8ed
  • tab.activeForeground#201d20
  • tab.border#ede8ed
  • tab.hoverBackground#dbd2da
  • tab.inactiveBackground#e4dde3
  • tab.inactiveForeground#6b616a
  • tab.unfocusedActiveBorder#8b7e89
  • tab.unfocusedActiveForeground#6b616a
  • tab.unfocusedInactiveForeground#6b616a
  • terminal.ansiBlack#d1c7d0
  • terminal.ansiBlue#dd40cb
  • terminal.ansiBrightBlack#9e949d
  • terminal.ansiBrightBlue#766b75
  • terminal.ansiBrightCyan#6b616a
  • terminal.ansiBrightGreen#9e949d
  • terminal.ansiBrightMagenta#605758
  • terminal.ansiBrightRed#6f645d
  • terminal.ansiBrightWhite#0d070c
  • terminal.ansiBrightYellow#8b7e89
  • terminal.ansiCyan#9e42d7
  • terminal.ansiGreen#8a2ac6
  • terminal.ansiMagenta#a82435
  • terminal.ansiRed#c26129
  • terminal.ansiWhite#201d20
  • terminal.ansiYellow#a82435
  • terminal.background#f9f6f8
  • terminal.foreground#4b444a
  • textLink.activeForeground#9e42d7
  • textLink.foreground#9e42d7
  • titleBar.activeBackground#ede8ed
  • titleBar.activeForeground#201d20
  • titleBar.inactiveBackground#f9f6f8
  • walkThrough.embeddedEditorBackground#f9f6f8
  • welcomePage.buttonBackground#f9f6f8
  • welcomePage.buttonHoverBackground#f9f6f8
  • widget.shadow#a99ea7

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#0d070c
meta.embedded, source.groovy.embedded#4b444a
comment, punctuation.definition.comment#948993italic
variable, string constant.other.placeholder#c26129
constant.other.color#150413
invalid, invalid.illegal#0d070c
keyword, punctuation.accessor, storage.type#a82435
storage.modifier#a82435
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#a99ea7
keyword.control, constant.other.color, keyword.other.template, keyword.other.substitution#9e42d7
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#c26129
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.debugger, keyword.other.special-method#a82435
meta.block variable.other#4b444a
support.other.variable, string.other.link#a05022
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other#564e55
string, 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#dd40cbnormal
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#a82435
support.type#9e42d7
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#7a1a27
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#c26129
variable.language#c26129italic
entity.name.method.js#a82435italic
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#a82435
entity.other.attribute-name#a82435
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#a82435italic
entity.other.attribute-name.class#534e56
source.sass keyword.control#a82435
markup.inserted#8a2ac6
markup.deleted#c26129
markup.deleted.diff#c26129
markup.inserted.diff#8a2ac6
markup.changed#a82435
string.regexp#9e42d7
constant.character.escape#9e42d7
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#c26129italic
source.js constant.other.object.key.js string.unquoted.label.js#c26129italic
support.type.property-name.json#a82435
support.constant.json#8a2ac6
meta.structure.dictionary.value.json string.quoted.double#a82435
meta.structure.dictionary.json meta.structure.dictionary.value constant.language#c26129
source.json meta.structure.dictionary.json support.type.property-name.json#a82435
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#a82435
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#8a2ac6
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#a82435
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#a82435
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#8a2ac6
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#8a2ac6
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#8a2ac6
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#8a2ac6
text.html.markdown, punctuation.definition.list_item.markdown#150413
text.html.markdown, beginning.punctuation.definition.list.markdown#564e55
text.html.markdown markup.inline.raw.markdown#a82435
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#766b75
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#c26129
markup.italic.markdown#a05022italic
markup.bold, markup.bold string#a05022bold
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#a05022bold
markup.underline#a82435underline
markup.strikestrike
markup.quote punctuation.definition.blockquote.markdown#ede8ed
markup.quote.markdown#564e55
markup.quoteitalic
string.other.link.title.markdown#a82435
markup.underline.link.markdown#dd40cb
string.other.link.description.title.markdown#a82435
constant.other.reference.link.markdown#a82435
markup.raw.block#a82435
markup.raw.block.fenced.markdown#ede8ed
punctuation.definition.fenced.markdown#ede8ed
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#150413
variable.language.fenced.markdown#766b75
meta.separator#766b75bold
markup.table#150413
token.info-token#dd40cb
token.warn-token#a05022
token.error-token#c26129
token.debug-token#a82435
string#201d20
string.quoted, meta.attribute-selector.css entity.other.attribute-name.attribute, variable.other.readwrite.js#581350
support.constant.math#8a2ac6
string.regexp#8a2ac6
constant.numeric, constant.character.numeric#201d20
variable.language, variable.other#c26129
variable.language.this.js, variable.language.this.php#c26129
keyword#8a2ac6
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#564e55italic
entity.name.class, meta.class entity.name.type.class#a05022
entity.name.type#564e55
entity.name.function#564e55
punctuation.definition.variable#564e55
punctuation.section.embedded.begin, punctuation.section.embedded.end#a42395
constant.language, punctuation.definition.constant, variable.other.constant, meta.preprocessor#8a2ac6
support.function.construct, keyword.other.new#931f2f
constant.character, constant.other#a05022
constant.character.escape#a05022
string.regexp, string.regexp keyword.other#766b75
entity.other.inherited-class#a82435
entity.name.tag#c26129
punctuation.definition.tag, meta.tag#564e55
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#8a2ac6
entity.other.attribute-name#a42395
entity.name.tag.custom#dd40cb
support.function#564e55
punctuation.separator.continuation#c26129
invalid.broken#f9f6f8
invalid.unimplemented#150413
invalid.illegal#150413
support.type, support.class#9e42d7
support.variable.dom#9e42d7
support.type.exception#a05022
support.other.variable
invalid#150413
invalid.deprecated#a05022
keyword.operator#9e42d7
keyword.operator.relational#a82435italic
keyword.operator.assignment#a82435
keyword.operator.arithmetic#a82435
keyword.operator.bitwise#a82435
keyword.operator.increment#a82435
keyword.operator.ternary#a82435
comment.line.double-slash#9e949d
object#dd40cb
constant.language.null#c26129
meta.brace#9e949d
meta.delimiter.period#201d20
constant.language.boolean#c26129
object.comma#0d070c
variable.parameter.function#9e42d7
support.type.vendor.property-name, support.constant.vendor.property-value, support.type.property-name, meta.property-list entity.name.tag#a82435
meta.property-list entity.name.tag.reference#dd40cb
constant.other.color.rgb-value punctuation.definition.constant#a05022
meta.selector#a82435italic
entity.other.attribute-name.id#363031
meta.property-name#9e42d7
entity.name.tag.doctype, meta.tag.sgml.doctype#9e949ditalic
keyword.control.operator#9e42d7
keyword.operator.logical#a82435
variable.instance, variable.other.instance, variable.readwrite.instance, variable.other.readwrite.instance, variable.other.property#8a2ac6
variable.other.object.property#201d20italic
variable.other.object.js, variable.other.object.jsx, variable.object.property.js, variable.object.property.jsx#201d20
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#a42395italic
variable.interpolation#c26129
support.variable.property#9e42d7
string.template meta.template.expression#c26129
string.template punctuation.definition.string#201d20
italic#a82435italic
bold#8a2ac6bold
quote#9e949ditalic
raw#564e55
variable.assignment.coffee#9e42d7
variable.parameter.function.coffee#201d20
variable.assignment.coffee#8a2ac6
variable.other.readwrite.cs#201d20
entity.name.type.class.cs, storage.type.cs#a82435
entity.name.type.namespace.cs#564e55
entity.name.tag.css, entity.name.tag.less, entity.name.tag.custom.css#29272b
support.constant.property-value.css#7524a8
entity.name.tag.wildcard.css, entity.name.tag.wildcard.less, entity.name.tag.wildcard.scss, entity.name.tag.wildcard.sass#9e42d7
keyword.other.unit.css, keyword.control.at-rule.media.css#9e42d7
source.elixir support.type.elixir, source.elixir meta.module.elixir entity.name.class.elixir#a82435
source.elixir entity.name.function#8a2ac6
source.elixir constant.other.symbol.elixir, source.elixir constant.other.keywords.elixir#dd40cb
source.elixir variable.other.readwrite.module.elixir, source.elixir variable.other.readwrite.module.elixir punctuation.definition.variable.elixir#8a2ac6
source.elixir .punctuation.binary.elixir#a82435italic
source.go meta.function-call.go#564e55
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#a82435italic
source.go constant.language.go, source.go constant.other.placeholder.go#c26129
meta.class entity.name.type.class.js#a05022
meta.method.declaration storage.type.js#534e56
terminator.js#201d20
meta.js punctuation.definition.js#201d20
entity.name.type.instance.jsdoc, entity.name.type.instance.phpdoc#9e949d
variable.other.jsdoc, variable.other.phpdoc#9e42d7
variable.other.meta.import.js, meta.import.js variable.other, variable.other.meta.export.js, meta.export.js variable.other#201d20
variable.parameter.function.js#a82435
variable.js, variable.other.js#201d20
entity.name.type.js, entity.name.type.module.js#a05022
support.class.js#201d20
variable.other.ruby#201d20
entity.name.type.class.ruby#a05022
constant.language.symbol.hashkey.ruby#8a2ac6
meta.attribute-selector.less entity.other.attribute-name.attribute#a05022
variable.other.php, variable.other.property.php#201d20
support.class.php#a05022
meta.function-call.php punctuation#201d20
variable.other.global.php#8a2ac6
variable.other.global.php punctuation.definition.variable#8a2ac6
constant.language.python#c26129
variable.parameter.function.python, meta.function-call.arguments.python#a82435
meta.function-call.python, meta.function-call.generic.python#201d20
punctuation.python#201d20
entity.name.function.decorator.python#8a2ac6
source.python variable.language.special#a82435
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass#534e56
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable#a82435
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute#a05022
entity.name.tag.scss, entity.name.tag.sass#8a2ac6
keyword.other.unit.scss, keyword.other.unit.sass#a82435
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#201d20
entity.name.type.ts, entity.name.type.tsx#a05022
support.class.node.ts, support.class.node.tsx#a82435
meta.type.parameters.ts entity.name.type, meta.type.parameters.tsx entity.name.type#9e949d
meta.import.ts punctuation.definition.block, meta.import.tsx punctuation.definition.block, meta.export.ts punctuation.definition.block, meta.export.tsx punctuation.definition.block#201d20
meta.decorator punctuation.decorator.ts, meta.decorator punctuation.decorator.tsx#a82435
meta.tag.js meta.jsx.children.tsx#a82435
entity.name.tag.yaml#8a2ac6
variable.other.readwrite.js, variable.parameter#8b1d7e
support.class.component.js, support.class.component.tsx#a05022
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#201d20
meta.class entity.name.type.class.tsx#a05022
entity.name.type.tsx, entity.name.type.module.tsx#a05022
meta.method.declaration storage.type.ts, meta.method.declaration storage.type.tsx#a82435
meta.property-list.css meta.property-value.css variable.other.less, meta.property-list.scss variable.scss, meta.property-list.sass variable.sass, meta.brace, keyword.operator.operator, keyword.operator.or.regexp, keyword.operator.expression.in, keyword.operator.relational, keyword.operator.assignment, keyword.operator.comparison, keyword.operator.type, keyword.operator, keyword, punctuation.definintion.string, punctuation, variable.other.readwrite.js, storage.type, source.css, entity.other.attribute-name.class, entity.other.attribute-name.id, string.quoted
meta.diff, meta.diff.header#201d20italic
markup.deleted#201d20
markup.changed#201d20
markup.inserted#201d20
markup.quote#8a2ac6
markup.list#8a2ac6
markup.bold, markup.italic#a05022
markup.inline.raw#766b75
markup.heading.setext#dd40cb

Shiki preview

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

Loading...

Base4Tone-VSCode-Themes by Atelierbram - VS Code Theme