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#100f0f
  • activityBar.foreground#cecdc3
  • activityBar.inactiveForeground#cecdc366
  • activityBarBadge.background#4385be
  • activityBarBadge.foreground#cecdc3
  • badge.background#4d4d4d
  • badge.foreground#ffffff
  • breadcrumb.activeSelectionForeground#e0e0e0
  • breadcrumb.background#100f0f
  • breadcrumb.focusForeground#e0e0e0
  • breadcrumb.foreground#cccccccc
  • button.background#4385be
  • button.foreground#ffffff
  • button.hoverBackground#205ea6
  • button.secondaryBackground#282726
  • button.secondaryForeground#cecdc3
  • button.secondaryHoverBackground#1c1b1a
  • checkbox.background#282726
  • checkbox.border#00000000
  • checkbox.foreground#cecdc3
  • debugExceptionWidget.background#333333
  • debugExceptionWidget.border#474747
  • debugToolBar.background#333333
  • debugToolBar.border#474747
  • diffEditor.border#444444
  • diffEditor.insertedTextBackground#9bb95533
  • diffEditor.removedTextBackground#ff000033
  • dropdown.background#282726
  • dropdown.border#00000000
  • dropdown.foreground#cecdc3
  • editor.background#100f0f
  • editor.findMatchBackground#515c6a
  • editor.findMatchBorder#74879f
  • editor.findMatchHighlightBackground#ea5c0055
  • editor.findMatchHighlightBorder#ffffff00
  • editor.findRangeHighlightBackground#3a3d4166
  • editor.findRangeHighlightBorder#ffffff00
  • editor.foldBackground#264f784d
  • editor.foreground#cecdc3
  • editor.hoverHighlightBackground#264f7840
  • editor.inactiveSelectionBackground#3a3d41
  • editor.lineHighlightBackground#ffffff0A
  • editor.lineHighlightBorder#282828
  • editor.rangeHighlightBackground#ffffff0b
  • editor.rangeHighlightBorder#ffffff00
  • editor.selectionBackground#264f78
  • editor.selectionHighlightBackground#add6ff26
  • editor.selectionHighlightBorder#495F77
  • editor.wordHighlightBackground#575757b8
  • editor.wordHighlightStrongBackground#004972b8
  • editorBracketHighlight.foreground1#d0a215
  • editorBracketHighlight.foreground2#ce5d97
  • editorBracketHighlight.foreground3#4385be
  • editorBracketHighlight.foreground4#8b7ec8
  • editorBracketHighlight.foreground5#3aa99f
  • editorBracketHighlight.foreground6#d14d41
  • editorBracketHighlight.unexpectedBracket.foreground#da702c
  • editorBracketMatch.background#0064001a
  • editorBracketMatch.border#888888
  • editorCodeLens.foreground#999999
  • editorCursor.background#000000
  • editorCursor.foreground#aeafad
  • editorError.background#B73A3400
  • editorError.border#ffffff00
  • editorError.foreground#da702c
  • editorGroup.border#444444
  • editorGroup.emptyBackground#100f0f
  • editorGroupHeader.tabsBackground#100f0f
  • editorGutter.addedBackground#879a39
  • editorGutter.background#100f0f
  • editorGutter.commentRangeForeground#c5c5c5
  • editorGutter.deletedBackground#94151b
  • editorGutter.foldingControlForeground#c5c5c5
  • editorGutter.modifiedBackground#4385be
  • editorHoverWidget.background#252526
  • editorHoverWidget.border#454545
  • editorHoverWidget.foreground#cccccc
  • editorIndentGuide.activeBackground1#707070
  • editorIndentGuide.background1#404040
  • editorInfo.background#4490BF00
  • editorInfo.border#4490BF00
  • editorInfo.foreground#4385be
  • editorLineNumber.activeForeground#c6c6c6
  • editorLineNumber.foreground#858585
  • editorLink.activeForeground#4e94ce
  • editorMarkerNavigation.background#2d2d30
  • editorMarkerNavigationError.background#f48771
  • editorMarkerNavigationInfo.background#75beff
  • editorMarkerNavigationWarning.background#cca700
  • editorOverviewRuler.background#25252500
  • editorOverviewRuler.border#7f7f7f4d
  • editorRuler.foreground#5a5a5a
  • editorSuggestWidget.background#252526
  • editorSuggestWidget.border#454545
  • editorSuggestWidget.foreground#d4d4d4
  • editorSuggestWidget.highlightForeground#0097fb
  • editorSuggestWidget.selectedBackground#062f4a
  • editorWarning.background#A9904000
  • editorWarning.border#ffffff00
  • editorWarning.foreground#d0a215
  • editorWhitespace.foreground#e3e4e229
  • editorWidget.background#1c1b1a
  • editorWidget.foreground#cecdc3
  • editorWidget.resizeBorder#5F5F5F
  • focusBorder#cecdc3
  • foreground#cecdc3
  • gitDecoration.addedResourceForeground#879a39
  • gitDecoration.conflictingResourceForeground#8b7ec8
  • gitDecoration.deletedResourceForeground#d14d41
  • gitDecoration.ignoredResourceForeground#878580
  • gitDecoration.modifiedResourceForeground#da702c
  • gitDecoration.stageDeletedResourceForeground#d14d41
  • gitDecoration.stageModifiedResourceForeground#da702c
  • gitDecoration.submoduleResourceForeground#4385be
  • gitDecoration.untrackedResourceForeground#879a39
  • icon.foreground#cecdc3
  • input.background#282726
  • input.border#00000000
  • input.foreground#cecdc3
  • input.placeholderForeground#a6a6a6
  • inputOption.activeBackground#FFFFFF1F
  • inputOption.activeBorder#007acc00
  • inputOption.activeForeground#ffffff
  • list.activeSelectionBackground#282726
  • list.activeSelectionForeground#cecdc3
  • list.dropBackground#383b3d
  • list.focusBackground#282726
  • list.focusForeground#cecdc3
  • list.highlightForeground#4385be
  • list.hoverBackground#1c1b1a
  • list.hoverForeground#cccccc
  • list.inactiveSelectionBackground#282726
  • list.inactiveSelectionForeground#cecdc3
  • listFilterWidget.background#282726
  • listFilterWidget.noMatchesOutline#d14d41
  • listFilterWidget.outline#00000000
  • menu.background#1c1b1a
  • menu.border#00000085
  • menu.foreground#cecdc3
  • menu.selectionBackground#4385be
  • menu.selectionBorder#00000000
  • menu.selectionForeground#ffffff
  • menu.separatorBackground#cecdc3
  • menubar.selectionBackground#ffffff1a
  • menubar.selectionForeground#cecdc3
  • merge.commonContentBackground#282828
  • merge.commonHeaderBackground#383838
  • merge.currentContentBackground#27403B
  • merge.currentHeaderBackground#367366
  • merge.incomingContentBackground#28384B
  • merge.incomingHeaderBackground#395F8F
  • minimap.background#100f0f
  • minimap.errorHighlight#f48771
  • minimap.findMatchHighlight#515c6a
  • minimap.selectionHighlight#264f78
  • minimap.warningHighlight#cca700
  • minimapGutter.addedBackground#587c0c
  • minimapGutter.deletedBackground#94151b
  • minimapGutter.modifiedBackground#0c7d9d
  • notificationCenter.border#474747
  • notificationCenterHeader.background#303031
  • notificationCenterHeader.foreground#cccccc
  • notifications.background#252526
  • notifications.border#303031
  • notifications.foreground#cccccc
  • notificationsErrorIcon.foreground#f48771
  • notificationsInfoIcon.foreground#75beff
  • notificationsWarningIcon.foreground#cca700
  • notificationToast.border#474747
  • panel.background#100f0f
  • panel.border#80808059
  • panelSection.border#80808059
  • panelSectionHeader.background#100f0f
  • panelTitle.activeBorder#e7e7e7
  • panelTitle.activeForeground#e7e7e7
  • panelTitle.inactiveForeground#e7e7e799
  • peekView.border#007acc
  • peekViewEditor.background#001f33
  • peekViewEditor.matchHighlightBackground#ff8f0099
  • peekViewEditor.matchHighlightBorder#ee931e
  • peekViewEditorGutter.background#001f33
  • peekViewResult.background#252526
  • peekViewResult.fileForeground#ffffff
  • peekViewResult.lineForeground#bbbbbb
  • peekViewResult.matchHighlightBackground#ea5c004d
  • peekViewResult.selectionBackground#3399ff33
  • peekViewResult.selectionForeground#ffffff
  • peekViewTitle.background#1e1e1e
  • peekViewTitleDescription.foreground#ccccccb3
  • peekViewTitleLabel.foreground#ffffff
  • pickerGroup.border#282726
  • pickerGroup.foreground#4385be
  • progressBar.background#4385be
  • scrollbar.shadow#000000db
  • scrollbarSlider.activeBackground#bfbfbf66
  • scrollbarSlider.background#79797966
  • scrollbarSlider.hoverBackground#646464b3
  • selection.background#4385be
  • settings.focusedRowBackground#ffffff07
  • settings.headerForeground#cecdc3
  • sideBar.background#100f0f
  • sideBar.dropBackground#383b3d
  • sideBar.foreground#cecdc3
  • sideBarSectionHeader.background#100f0f
  • sideBarSectionHeader.border#00000000
  • sideBarSectionHeader.foreground#cecdc3
  • sideBarTitle.foreground#cecdc3
  • statusBar.background#282726
  • statusBar.debuggingBackground#da702c
  • statusBar.debuggingForeground#cecdc3
  • statusBar.foreground#cecdc3
  • statusBar.noFolderBackground#8b7ec8
  • statusBar.noFolderForeground#cecdc3
  • statusBarItem.activeBackground#FFFFFF25
  • statusBarItem.hoverBackground#ffffff1f
  • statusBarItem.remoteBackground#8b7ec8
  • statusBarItem.remoteForeground#cecdc3
  • tab.activeBackground#100f0f
  • tab.activeBorder#cecdc3
  • tab.activeBorderTop#00000000
  • tab.activeForeground#cecdc3
  • tab.border#100f0f
  • tab.inactiveBackground#100f0f
  • tab.inactiveForeground#878580
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#2472c8
  • terminal.ansiBrightBlack#666666
  • terminal.ansiBrightBlue#3b8eea
  • terminal.ansiBrightCyan#29b8db
  • terminal.ansiBrightGreen#23d18b
  • terminal.ansiBrightMagenta#d670d6
  • terminal.ansiBrightRed#f14c4c
  • terminal.ansiBrightWhite#e5e5e5
  • terminal.ansiBrightYellow#f5f543
  • terminal.ansiCyan#11a8cd
  • terminal.ansiGreen#0dbc79
  • terminal.ansiMagenta#bc3fbc
  • terminal.ansiRed#cd3131
  • terminal.ansiWhite#e5e5e5
  • terminal.ansiYellow#e5e510
  • terminal.background#100f0f
  • terminal.border#80808059
  • terminal.foreground#cccccc
  • terminal.selectionBackground#ffffff40
  • terminalCursor.background#0087FF
  • terminalCursor.foreground#cecdc3
  • textLink.foreground#4385be
  • titleBar.activeBackground#100f0f
  • titleBar.activeForeground#cecdc3
  • titleBar.border#00000000
  • titleBar.inactiveBackground#100f0f99
  • titleBar.inactiveForeground#cecdc399
  • tree.indentGuidesStroke#585858
  • walkThrough.embeddedEditorBackground#00000050
  • widget.shadow#0000005c

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
support.module.elm, entity.other.inherited-class.python, variable.other.object, support.other.namespace.php, entity.other.attribute-name.namespace.xml, record.accessor, entity.name.record.field.accessor, storage.modifier.import.java, storage.modifier.import.groovy, meta.import.swift entity.name.type.swift, meta.member.access.python, variable.other.property.ts, variable.other.property.js, constant.language.symbol.elixir, punctuation.tag.liquid support.class.liquid, meta.scriptblock.powershell meta.group.simple.subexpression.powershell meta.group.simple.subexpression.powershell meta.scriptblock.powershell meta.scriptblock.powershell support.variable.automatic.powershell punctuation.definition.variable.powershell, meta.scriptblock.powershell meta.group.simple.subexpression.powershell meta.group.simple.subexpression.powershell meta.scriptblock.powershell meta.scriptblock.powershell support.variable.automatic.powershell#da702c
entity.name.type#A4EF58
comment, punctuation.definition.comment, string.quoted.docstring.multi, comment.block.documentation source#878580italic
constant, support.constant.core.php#E35535
meta.section.struct.go variable.other.field.go, meta.section.struct.go variable.other.declaration.go, source, support, constant.character.entity.named, meta.jsx.children, source.lua, text.html.derivative, source.graphql meta.selections variable.other.alias.graphql, source.graphql meta.type.interface.graphql meta.type.object.graphql variable.graphql, source.graphql variable.arguments.graphql#b5bdcc
entity.name.function.decorator, meta.decorator entity.name.function, meta.decorator punctuation.decorator, punctuation.definition.decorator, meta.decorator variable.other.readwrite.ts, variable.parameter.gdscript, entity.name.variable.parameter, variable.parameter#ce5d97
keyword.control.export, support.type.object.module#d0a215
support.function, entity.name.function, meta.function-call, meta.function, meta.method.declaration, meta.function-call support, variable.language.super.ts, source.directive, meta.function-call.generic, meta.method-call.static.php, meta.method-call.php, meta.class storage.type, meta.method.groovy, meta.bracket.square.access, entity.name.function-call.elixir, punctuation.output.liquid support.variable.liquid, meta.function.echo.edge source.js keyword.operator.error-control.js, entity.name.type.variant.gdscript, entity.name.function.powershell#4385be
keyword.control.import, meta.module.name.elm support, meta.import.elm support, keyword.control.at-rule, punctuation.definition.keyword, variable.control.import.include, keyword.other.import.java#d0a215
keyword.package.go, keyword.operator.pointer.go, keyword.control, keyword.control.conditional, storage.modifier, keyword.operator.new, keyword.operator.expression, keyword.begin.blade, keyword.end.blade, keyword.blade, keyword.type-alias, keyword.type, support.class.console, keyword.other.await, storage.type.class.jsdoc, punctuation.definition.block.tag.jsdoc, keyword.other.new, keyword.other.phpdoc, keyword.other.use.php, keyword.operator.logical.python, keyword.other.import.static.groovy, keyword.other.import.groovy, punctuation.definition.attribute.swift, source.svelte meta.scope.tag.main.svelte meta.tag.start.svelte variable.function.svelte, meta.directive.on.svelte entity.name.type.svelte, keyword.other.special-method.elixir, keyword.edge, entity.name.function.edge, support.constant.edge, keyword.other.gdscript, keyword.other.onready.gdscript, source.graphql meta.fragment.graphql keyword.on.graphql, source.graphql meta.type.interface.graphql keyword.implements.graphql, source.graphql meta.type.interface.graphql meta.type.object.graphql meta.type.list.graphql keyword.operator.nulltype.graphql, source.graphql meta.variables.graphql keyword.operator.nulltype.graphql, source.graphql meta.type.interface.graphql meta.type.object.graphql keyword.operator.nulltype.graphql, keyword.operator.class.php, keyword.operator.spread.php, keyword.operator.type.php, keyword.operator.increment-decrement.php, keyword.operator.increment-increment.php, punctuation.support.type.property-name.begin.json, punctuation.support.type.property-name.end.json, keyword.operator.string.php, keyword.operator.ternary.php, keyword.operator.variadic.php, keyword.operator.nullable-type.php, keyword.other.use-as.php, keyword.import.go, keyword.operator.address.go, keyword.operator.null-coalescing, keyword.operator.arrow, keyword.struct.go, keyword.operator.liquid, keyword.operator.optional.ts, keyword.cmake#d0a215
meta.object-literal.key, variable.object.property#cecdc3
keyword.other.definition.ini, support.type.property-name, entity.name.tag.yaml#d0a215
keyword.operator.comparison, storage.type.function.arrow, keyword.operator.lua, keyword.operator.assignment, keyword.operator.relational, keyword.operator.increment, keyword.operator.decrement, keyword.operator.logical, keyword.operator.arithmetic, keyword.operator.math#d0a215
punctuation, attribute_value, meta.brace, punctuation.definition.parameters, punctuation.definition.template-expression, keyword.operator, keyword.other, punctuation.terminator, punctuation.separator, punctuation.definition.generic.begin, punctuation.definition.generic.end, meta.function.type-declaration, keyword.other.colon.elm, meta.record.field.elm keyword.other.elm, keyword.other.period.elm, meta.tag.xml, meta.tag.preprocessor.xml, punctuation.definition.block, punctuation.accessor, constant.name.attribute.tag.pug, string.interpolated.pug, keyword.other.whitespace.liquid, meta.tag.template.block.twig, meta.tag.template.value.twig, begin.bracket, end.bracket, text.html.twig meta.tag.inline.any, text.html.twig meta.tag.block.any, support.function.construct.begin.blade, support.function.construct.end.blade source.php, support.function.construct.end.blade, meta.function.echo.blade source.php, punctuation.definition.list.begin.python, punctuation.definition.list.end.python, text.html.vue-html meta.tag.block.any, keyword.operator.assignment.tsx, meta.definition.method.signature.java, meta.class.body.groovy, meta.definition.method.groovy meta.method.body.java meta.declaration.assertion.groovy, punctuation.definition.list.begin.erlang, meta.expression.parenthesized, meta.definition.function.swift meta.parameter-clause.swift, source.swift meta.function-call.swift, punctuation.section.embedded.end.swift source.swift, source.lua, meta.function.lua, punctuation.definition.keyword.svelte, source.svelte meta.scope.tag.SpeakerPicture.svelte meta.tag.start.svelte entity.other.attribute-name.svelte, expression.embbeded.vue punctuation.definition.tag.begin.html.vue, expression.embbeded.vue punctuation.definition.tag.end.html.vue, source.graphql meta.type.interface.graphql meta.type.object.graphql meta.type.list.graphql meta.brace.square.graphql, punctuation.output.liquid, text.html.liquid meta.tag.liquid punctuation.definition.tag.end.liquid#d3d8e160
entity.name.package.go, variable.language.this, variable.language.special.self, variable.parameter.function.language.special.self, variable.language.this.php punctuation.definition.variable.php, meta.class.body.php storage.type.php, variable.parameter.function.swift entity.name.function.swift, variable.other.jsdoc, support.variable.drive.powershell#da702c
storage, meta.var.expr storage.type, storage.type.function, keyword.function, storage.type.class, storage.type.property, keyword.other, keyword.local.lua, entity.name.class, meta.function.lua keyword.control.lua, storage.type.enum, storage.type.interface, storage.type.type, entity.name.type.class.java, support.class.php, entity.other.inherited-class.php, entity.name.type.class.groovy, storage.type.rust, entity.name.type.class.swift, source.svelte meta.script.svelte source.ts entity.name.label.ts, meta.directive.on.svelte keyword.control.svelte, storage.type.const.gdscript, storage.type.var.gdscript, source.graphql declaration.meta.type keyword, source.graphql meta.type.interface.graphql keyword.type.graphql, source.graphql keyword.schema.graphql, source.graphql keyword.operation.graphql, source.graphql meta.enum.graphql keyword.enum.graphql, source.graphql meta.fragment.graphql keyword.fragment.graphql, storage.type.trait.php, keyword.type.go, keyword.var.go, storage.type.powershell, keyword.const.go#3aa99f
string, string.template, string.quoted.single, punctuation.definition.string, punctuation.definition.string.template, punctuation.definition.string.begin, punctuation.definition.string.end.html source.js-ignored-vscode, punctuation.definition.string.end.html source.js, punctuation.definition.string.end.html.vue, punctuation.definition.string.end.html source.ts, punctuation.definition.string.end.html source.tsx, punctuation.definition.string.end.html source.js.jsx, punctuation.definition.string.end, string.other.link, constant.character.escape.regexp, variable.parameter.url, constant.other.symbol.quoted.single.erlang, constant.other.symbol.quoted.single.erlang punctuation.definition.symbol.begin.erlang, constant.other.symbol.quoted.single.erlang punctuation.definition.symbol.end.erlang, meta.import.ts punctuation.definition.variable.svelte, punctuation.definition.string.end.html source.css-ignored-vscode, text.html.edge punctuation.definition.variable.js, string.unquoted.plain.out.yaml, string.quoted.single.python punctuation.definition.string.begin.python, string.quoted.single.python punctuation.definition.string.end.python#879a39
string.quoted.docstring.multi.python, string.quoted.double.block.python punctuation.definition.string.end.python, string.quoted.double.block.python punctuation.definition.string.begin.python, string.quoted.double.block.python, punctuation.definition.string.begin.python, punctuation.definition.string.end.python#3CEC8560
entity.name.type, support.type, support.class, storage.type, entity.other.inherited-class, keyword.type, storage.type.java, storage.type.primitive.java, storage.type.generic.java, keyword.other.type, punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php source.php, punctuation.section.embedded.end.php, storage.type.object.array.java, storage.type.primitive.groovy, storage.type.groovy, meta.definition.type.body.swift meta.function-call.swift, meta.definition.type.class.swift meta.inheritance-clause.swift, variable.other.constant.elixir, source.graphql declaration.meta.type support, source.graphql meta.selections, source.graphql meta.enum.graphql meta.type.object.graphql constant.character.enum.graphql, source.graphql meta.fragment.graphql entity.name.fragment.graphql, entity.name.type.class.php, support.class.php, entity.other.inherited-class.php, entity.other.alias.php, meta.group.simple.subexpression.powershell meta.scriptblock.powershell storage.type.powershell#8b7ec8
variable, variable.language, entity.name.type.class.js, entity.name.variable, support.variable.magic, meta.method.body, entity.name.variable, punctuation.definition.variable, meta.class variable.object.property, variable.other.constant entity.name.function, entity.name.variable.tuple-element.cs punctuation.separator.colon.cs, meta.definition.variable.name.groovy, meta.body.struct.cpp, parameter.variable.function.elixir, meta.directive.edge source.js, meta.function.echo.edge source.js, text.html.edge meta.function.echo.edge meta.function-call.js, source.css variable.parameter.keyframe-list.css, source.css meta.property-value.css, source.css.scss meta.at-rule.keyframes.scss entity.name.function.scss, source.css.scss meta.property-value.scss, entity.name.variable.tuple-element, meta.group.simple.subexpression.powershell support.variable.automatic.powershell, support.variable.automatic.powershell, storage.source.cmake, entity.source.cmake#d14d41
source.elm constant.type-constructor#d14d41
source.elm storage.type#8b7ec8
entity.name.tag.other.html, entity.name.tag support.class.component, support.class.component.html#8b7ec8
source.diff meta.diff.header.to-file, source.diff markup.inserted.diff, source.diff punctuation.definition.to-file.diff, source.diff punctuation.definition.inserted.diff#3CEC85
source.diff punctuation.definition.from-file.diff, source.diff meta.diff.header.from-file, source.diff markup.deleted.diff, source.diff punctuation.definition.deleted.diff#E35535
source.diff meta.diff.header.command#4385be
source.diff punctuation.definition.range.diff, source.diff meta.diff.range.unified#da702c
support.variable.liquid, support.class.liquid#d14d41
text.html.basic entity.name, source.js-ignored-vscode, entity.name.tag, meta.embedded.block.blade constant.other.php, meta.embedded.block.blade keyword.operator.comparison.php, meta.embedded.block.blade keyword.operator.arithmetic.php, meta.tag.start.svelte keyword.control.svelte, meta.tag.end.svelte keyword.control.svelte#4385be
meta.tag.sgml.doctype.html, punctuation.definition.tag, meta.tag.block.any, meta.tag.block.any.html, meta.tag.inline.any, source.css-ignored-vscode, meta.tag.metadata.style.end.html, text.html.vue invalid.illegal.character-not-allowed-here.html, meta.tag.inline.i.start.html, meta.tag.structure.div.start.html, punctuation.definition.tag.end.html.vue, invalid.illegal.character-not-allowed-here.html#69C3FFaa
entity.other.attribute-name, entity.name.tag.liquid, invalid.deprecated.entity.other.attribute-name, meta.embedded.block.blade storage.type.php#d0a215
markup.inline.raw.string.markdown, punctuation.definition.raw.markdown, markup.fenced_code.block.markdown, markup.fenced_code.block.markdown punctuation, markup.raw.block.markdown#8b7ec8
fenced_code.block.language#8b7ec8
punctuation.definition.list.begin#4385be
punctuation.definition.list.begin#4385be
entity.name.section, markup.heading.setext#d0a215
punctuation.definition.heading#d0a215
markup.underline.link, markup.underline.link.image#4385be
markup.bold, punctuation.definition.bold#d14d41bold
markup.strikethrough, punctuation.definition.strikethrough#E35535
markup.italic, punctuation.definition.italic#da702citalic
markup.quote, markup.quote.markdown punctuation.definition.quote.begin#ce5d97
punctuation.definition.quote.begin#4385be
meta.embedded.block.frontmatter punctuation.definition.tag.begin, meta.embedded.block.frontmatter punctuation.definition.tag.end, meta.embedded.block.frontmatter string.unquoted.plain.out#878580italic
entity.other.attribute-name.pseudo-class#ce5d97
entity.other.attribute-name.pseudo-element#ce5d97
entity.other.attribute-name.class, entity.other.attribute-name.class punctuation.definition.entity#3aa99f
entity.other.attribute-name.parent-selector-suffix punctuation.definition.entity#3aa99f
support.type.property-name.css, support.type.vendored.property-name, meta.property-list entity.name.tag.css, meta.property-list.scss meta.property-list.scss entity.name.tag.css, meta.property-list meta.property-name, source.css.scss meta.property-list.scss entity.name.tag.css#cecdc3
source.css.scss entity.other.attribute-name.id , source.css entity.other.attribute-name.id , entity.other.attribute-name.id punctuation.definition.entity#8b7ec8
entity.name.tag.reference, meta.property-list#da702c
keyword.other.unit#da702c
support.constant.property-value, support.constant.font-name, meta.property-value.css, meta.attribute.style.html#da702c
constant.numeric#da702c
entity.name.tag.css, meta.property-list.scss entity.name.tag.css#4385be

Shiki preview

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

Loading...

Flexoki by sglza - VS Code Theme