Vibrant color themes — BESUR, Soft, Light, Barca, Ocean, Rainbow, Spain, Argentina & Zen — with extended language support: JS/TS, Python, Rust, Go, PHP, SQL, XML, YAML, TOML, Markdown, Bash, and more.
Full workbench mockup using this variant's colors and tokenColors.
Loading...
Workbench UI color keys from the theme JSON colors map.
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment, fenced_code.block.language.markdown | #5a6986aa | italic |
| punctuation.definition.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, meta.tag, punctuation.separator.inheritance.php, keyword.other.template, keyword.other.substitution, meta.arrow, storage.type.function.arrow, keyword.operator.assignment, punctuation.terminator.rule.css, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded.begin, punctuation.section.embedded.end | #6e7d9a | — |
| variable, variable.other, variable.other.readwrite, variable.other.object, string constant.other.placeholder, meta.block variable.other, entity.name.method, variable.function.constructor, markup.changed, constant.character.escape, markup.inline.raw.string.markdown, entity.other.attribute-name.class.css, entity.other.inherited-class.ruby, keyword.control.pseudo-method.ruby, entity.name.variable.parameter.python, variable.parameter.function.python, variable.other.property, support.variable | #44dfff | — |
| keyword, keyword.control, keyword.operator, storage.type, storage.modifier, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other, markup.heading, markup.inserted.git_gutter, entity.other.attribute-name | #ffffff | — |
| entity.name.function, meta.function-call, variable.function, support.function, entity.name.tag, entity.name, keyword.control.flow, keyword.control.conditional, keyword.control.loop, keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.return, keyword.control.async, keyword.control.await, keyword.control.try, keyword.control.except, keyword.control.raise, invalid, invalid.illegal, markup.deleted.git_gutter, markup.changed.git_gutter, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, support.type.sys-types | #ff006a | — |
| string, string.quoted, string.quoted.single, string.quoted.double, string.quoted.triple, string.template, string.regexp, string.interpolated, entity.other.attribute-name.pseudo-class.css, entity.other.inherited-class, keyword.other.special-method, markup.inserted.git_gutter, variable.language | #aaed36 | — |
| constant.numeric, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.octal, constant.numeric.binary, tag.decorator entity.name.tag, tag.decorator punctuation.definition.tag, entity.name.decorator, keyword.operator.logical, constant.language.symbol.ruby, constant.other.color, constant.other.symbol, constant.other.key, punctuation.definition.annotation, storage.type.annotation | #f5af19 | — |
| markup.bold, markup.bold string, entity.name, entity.other.inherited-class, entity.other.attribute-name.class.css, keyword.other.important.css, keyword.other.important.scss, support.class, support.class.ruby | — | bold |
| markup.italic, comment | — | italic |
| markup.underline, *url*, *link*, *uri* | — | underline |
| text.html.markdown, punctuation.definition.list_item.markdown, markup.italic | #dddddd | — |
| meta.import, punctuation.terminator.statement, keyword.control.import, keyword.control.from | #5a6986aa | — |
| string.other.link.title.markdown, constant.other.reference.link.markdown | #44dfff | — |
| markup.quote, markup.quote punctuation.definition.blockquote.markdown, meta.separator, markup.table | #6e7d9a | italic |
| markup.raw.block | #cccccc | — |
| markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold | #cccccc | bold italic |
| support.type, 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 | #6e7d9a | — |
| entity.other.attribute-name.id.css, entity.other.attribute-name.id, entity.name.tag.css | #ff006a | — |
| support.constant.property-value.css, support.constant.font-name.css, support.constant.media-type.media.css, support.constant.media.css, constant.other.color.rgb-value.css, constant.other.color.rgb-value.hex.css | #aaed36 | — |
| keyword.other.unit.px.css, keyword.other.unit.em.css, keyword.other.unit.rem.css, keyword.other.unit.vh.css, keyword.other.unit.vw.css, keyword.other.unit.pt.css, keyword.other.unit.percent.css, keyword.other.unit.css | #f5af19 | — |
| keyword.other.sql, keyword.other.create.sql, keyword.other.drop.sql, keyword.other.select.sql, keyword.other.insert.sql, keyword.other.update.sql, keyword.other.delete.sql, keyword.other.where.sql, keyword.other.from.sql, keyword.other.join.sql, keyword.other.on.sql, keyword.other.as.sql, keyword.other.order.sql, keyword.other.group.sql, keyword.other.by.sql, keyword.other.having.sql, keyword.other.limit.sql, keyword.other.offset.sql, keyword.other.union.sql, keyword.other.intersect.sql, keyword.other.except.sql, keyword.other.into.sql, keyword.other.values.sql, keyword.other.set.sql, keyword.other.table.sql, keyword.other.database.sql, keyword.other.index.sql, keyword.other.primary.sql, keyword.other.foreign.sql, keyword.other.key.sql, keyword.other.references.sql, keyword.other.constraint.sql, keyword.other.not.sql, keyword.other.null.sql, keyword.other.unique.sql, keyword.other.default.sql, keyword.other.check.sql, keyword.other.transaction.sql, keyword.other.begin.sql, keyword.other.commit.sql, keyword.other.rollback.sql, keyword.other.grant.sql, keyword.other.revoke.sql, keyword.other.procedure.sql, keyword.other.function.sql, keyword.other.trigger.sql, keyword.other.view.sql, keyword.other.alter.sql, support.function.aggregate.sql, support.function.window.sql | #ff006a | bold |
| storage.type.sql, storage.type.numeric.sql, storage.type.string.sql, storage.type.date.sql, keyword.other.type.sql | #44dfff | — |
| entity.name.function.sql, meta.toc-list.id.sql, variable.other.table.sql, variable.other.column.sql, constant.other.database-name.sql, constant.other.table-name.sql | #ffffff | — |
| support.function.scalar.sql, support.function.string.sql, support.function.numeric.sql, support.function.date.sql | #f5af19 | — |
| entity.name.tag.xml, entity.name.tag.localname.xml, meta.tag.xml | #ff006a | — |
| entity.other.attribute-name.xml, entity.other.attribute-name.localname.xml, entity.other.attribute-name.namespace.xml | #44dfff | — |
| entity.name.tag.namespace.xml, entity.other.attribute-name.namespace.xml, variable.other.documentroot.xml | #f5af19 | — |
| meta.tag.preprocessor.xml, punctuation.definition.tag.xml | #6e7d9a | — |
| entity.name.tag.yaml, string.unquoted.plain.out.yaml, string.unquoted.block.yaml, punctuation.definition.block.sequence.item.yaml | #44dfff | — |
| string.quoted.single.yaml, string.quoted.double.yaml, string.unquoted.plain.in.yaml | #aaed36 | — |
| entity.name.type.anchor.yaml, variable.other.alias.yaml, punctuation.definition.anchor.yaml, punctuation.definition.alias.yaml | #f5af19 | — |
| constant.language.boolean.yaml, constant.language.null.yaml, constant.language.yaml | #ff006a | — |
| keyword.key.toml, support.type.property-name.toml, variable.other.key.toml | #44dfff | — |
| entity.other.attribute-name.toml, entity.name.section.toml, punctuation.definition.table.toml, punctuation.definition.array.table.toml | #ff006a | bold |
| support.type.python, support.function.builtin.python, meta.function.decorator.python, entity.name.function.decorator.python, punctuation.definition.decorator.python | #f5af19 | — |
| variable.language.special.self.python, variable.language.special.cls.python, variable.parameter.function.language.special.self.python | #ff006a | italic |
| support.type.typing.python, meta.type.annotation.python, support.class.typing.python | #44dfff | — |
| entity.name.lifetime.rust, storage.modifier.lifetime.rust, punctuation.definition.lifetime.rust | #f5af19 | italic |
| entity.name.function.macro.rust, meta.macro.rust, support.macro.rust | #ff006a | — |
| entity.name.type.rust, entity.name.trait.rust, entity.name.struct.rust, entity.name.enum.rust, entity.name.union.rust, entity.name.impl.rust, storage.type.rust | #44dfff | — |
| keyword.type.go, keyword.package.go, keyword.import.go, keyword.function.go, keyword.var.go, keyword.const.go, keyword.interface.go, keyword.struct.go, keyword.map.go, keyword.chan.go, keyword.go.go, keyword.defer.go, keyword.select.go, keyword.fall_through.go | #ff006a | — |
| support.function.builtin.go, support.type.builtin.go | #f5af19 | — |
| variable.other.php, variable.other.global.php, variable.other.global.safer.php, variable.language.this.php | #44dfff | — |
| support.class.php, entity.name.type.class.php, storage.type.class.php, storage.type.interface.php, storage.type.trait.php, storage.type.enum.php | #f5af19 | — |
| support.function.string.php, support.function.array.php, support.function.math.php, support.function.datetime.php, support.function.url.php, support.function.file.php | #ff006a | — |
| variable.other.normal.shell, variable.other.positional.shell, variable.other.bracket.shell, variable.language.shell, variable.other.special.shell, variable.other.c-style.shell | #44dfff | — |
| support.function.builtin.shell, entity.name.command.shell, support.other.parenthesis.regexp | #ff006a | — |
| string.other.option.shell, constant.other.option.shell, punctuation.definition.flag.shell | #f5af19 | — |
| punctuation.definition.annotation.java, storage.type.annotation.java, variable.annotation.java | #f5af19 | — |
| storage.type.java, storage.type.primitive.java, entity.name.type.class.java, entity.name.type.interface.java, entity.name.type.enum.java | #44dfff | — |
| meta.preprocessor.c, keyword.control.directive.c, keyword.control.directive.cpp, keyword.control.directive.include.c, keyword.control.directive.include.cpp, keyword.control.directive.define.c, keyword.control.directive.define.cpp | #f5af19 | — |
| storage.type.c, storage.type.cpp, storage.type.built-in.c, storage.type.built-in.cpp, storage.type.primitive.c, storage.type.primitive.cpp | #44dfff | — |
| keyword.other.special-method.dockerfile, entity.name.function.dockerfile, keyword.other.dockerfile | #ff006a | bold |
| source.json support.type.property-name.json | #ff006a | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #44dfff | — |
| 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 | #aaed36 | — |
| 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 | #f5af19 | — |
| 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, 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 | #ffffff | — |
| keyword.operation.graphql, keyword.fragment.graphql, keyword.type.graphql, keyword.schema.graphql, keyword.enum.graphql, keyword.union.graphql, keyword.scalar.graphql, keyword.interface.graphql, keyword.input.graphql, keyword.directive.graphql, keyword.extends.graphql, keyword.implements.graphql, keyword.on.graphql | #ff006a | bold |
| variable.graphql, string.unquoted.alias.graphql, entity.name.fragment.graphql | #44dfff | — |
| support.type.graphql, entity.name.type.graphql, entity.name.type.object.graphql | #f5af19 | — |
| keyword.model.prisma, keyword.enum.prisma, keyword.datasource.prisma, keyword.generator.prisma, support.class.prisma, entity.name.type.model.prisma | #ff006a | bold |
| support.type.primitive.prisma, entity.name.type.prisma | #44dfff | — |
| string.regexp, constant.character.character-class.regexp, constant.other.character-class.regexp, constant.character.escape.regexp, keyword.control.anchor.regexp, keyword.operator.quantifier.regexp | #aaed36 | — |
| punctuation.definition.character-class.regexp, keyword.operator.or.regexp, punctuation.definition.group.regexp, punctuation.definition.group.assertion.regexp | #f5af19 | — |
Full workbench mockup using this variant's colors and tokenColors.
Loading...
Workbench UI color keys from the theme JSON colors map.
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, comment.line, comment.block, punctuation.definition.comment | #6a8aa8 | italic |
| punctuation.definition.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, meta.tag, punctuation.separator.inheritance.php, keyword.other.template, keyword.other.substitution, meta.arrow, storage.type.function.arrow, keyword.operator.assignment, punctuation.terminator.rule.css, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded.begin, punctuation.section.embedded.end | #3d6285 | — |
| entity.name.function, support.function, meta.function-call, entity.name.tag, entity.name.tag.html, entity.name.tag.css, support.class.component, support.class.component.tsx, support.class.component.jsx, punctuation.definition.heading.markdown, entity.name.section.markdown | #1f7ec4 | — |
| keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical, keyword.operator.delete, storage, storage.type, storage.modifier, keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.default, keyword.control.as | #c78500 | — |
| constant.numeric, constant.numeric.decimal, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.language, constant.language.boolean, constant.language.null, constant.language.undefined, support.constant, variable.other.constant | #b06a00 | — |
| entity.name.type, entity.name.type.class, entity.name.class, support.class, entity.other.inherited-class, entity.name.type.interface, entity.name.type.enum, entity.name.type.alias, meta.type.annotation, support.type | #0288b8 | — |
| string, string.quoted, string.quoted.single, string.quoted.double, string.quoted.template, string.template, punctuation.definition.string.begin, punctuation.definition.string.end | #0e8a6e | — |
| variable, variable.other, variable.other.readwrite, meta.object-literal.key, entity.name.tag.yaml, entity.other.attribute-name, support.type.property-name, support.type.property-name.css, support.type.property-name.json, meta.property-name | #2a6fd8 | — |
| variable.parameter, meta.parameter, entity.other.attribute-name.html, entity.other.attribute-name.jsx, entity.other.attribute-name.tsx, variable.other.property, meta.attribute | #0277c0 | — |
| variable.language, variable.language.this, variable.language.self, variable.language.super, keyword.other.this, entity.name.type.module | #4a4fd8 | — |
| meta.decorator, punctuation.decorator, entity.name.function.decorator, meta.annotation, storage.type.annotation, punctuation.definition.annotation | #b06a00 | — |
| keyword.operator, keyword.operator.arithmetic, keyword.operator.comparison, keyword.operator.relational, keyword.operator.ternary, keyword.operator.spread, keyword.operator.rest, keyword.operator.type, keyword.operator.optional | #0267a8 | — |
| string.regexp, constant.character.escape, constant.other.character-class.regexp, keyword.operator.quantifier.regexp, punctuation.definition.group.regexp | #8a6a00 | — |
| text, source, meta.brace, punctuation.separator, punctuation.terminator | #0d2438 | — |
| meta.tag.sgml.doctype, entity.name.tag.doctype, meta.tag.sgml.doctype.html | #c78500 | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, entity.name.tag.css | #1f7ec4 | — |
| support.constant.property-value.css, constant.other.color.rgb-value.css, constant.other.color.rgb-value.hex.css, support.constant.color.w3c-standard-color-name.css, meta.property-value.css | #0e8a6e | — |
| keyword.other.unit.css, keyword.other.unit.px.css, keyword.other.unit.rem.css, keyword.other.unit.em.css, keyword.other.unit.percentage.css | #b06a00 | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #c78500 | — |
| keyword.other.DML.sql, keyword.other.DDL.sql, keyword.other.sql, keyword.other.create.sql, keyword.other.data-integrity.sql, keyword.other.alias.sql | #c78500 | — |
| support.function.aggregate.sql, support.function.string.sql, support.function.scalar.sql | #1f7ec4 | — |
| storage.type.sql, support.type.sql | #0288b8 | — |
| entity.name.tag.xml, entity.name.tag.localname.xml | #1f7ec4 | — |
| entity.other.attribute-name.xml, entity.other.attribute-name.localname.xml | #0277c0 | — |
| entity.name.tag.namespace.xml, entity.other.attribute-name.namespace.xml | #c78500 | — |
| entity.name.tag.yaml, support.type.property-name.yaml | #2a6fd8 | — |
| entity.name.type.anchor.yaml, punctuation.definition.anchor.yaml, variable.other.alias.yaml, keyword.control.flow.alias.yaml | #c78500 | — |
| keyword.key.toml, support.type.property-name.toml | #2a6fd8 | — |
| entity.other.attribute-name.table.toml, support.type.property-name.table.toml, entity.other.attribute-name.table.array.toml | #1f7ec4 | — |
| support.type.property-name.json | #1f7ec4 | — |
| meta.structure.dictionary.value.json support.type.property-name.json | #c78500 | — |
| meta.structure.dictionary.value.json meta.structure.dictionary.value.json support.type.property-name.json | #0288b8 | — |
| meta.structure.dictionary.value.json meta.structure.dictionary.value.json meta.structure.dictionary.value.json support.type.property-name.json | #b06a00 | — |
| meta.structure.dictionary.value.json meta.structure.dictionary.value.json meta.structure.dictionary.value.json meta.structure.dictionary.value.json support.type.property-name.json | #2a6fd8 | — |
| heading.1.markdown entity.name.section.markdown, heading.1.markdown punctuation.definition.heading.markdown | #1f7ec4 | bold |
| heading.2.markdown entity.name.section.markdown, heading.2.markdown punctuation.definition.heading.markdown | #c78500 | bold |
| heading.3.markdown entity.name.section.markdown, heading.3.markdown punctuation.definition.heading.markdown | #0288b8 | bold |
| heading.4.markdown entity.name.section.markdown, heading.4.markdown punctuation.definition.heading.markdown | #0e8a6e | bold |
| heading.5.markdown entity.name.section.markdown, heading.5.markdown punctuation.definition.heading.markdown | #b06a00 | bold |
| heading.6.markdown entity.name.section.markdown, heading.6.markdown punctuation.definition.heading.markdown | #4a4fd8 | bold |
| markup.bold.markdown, punctuation.definition.bold.markdown | #c78500 | bold |
| markup.italic.markdown, punctuation.definition.italic.markdown | #0277c0 | italic |
| markup.underline.link.markdown, string.other.link.title.markdown, string.other.link.description.markdown | #0e8a6e | — |
| markup.inline.raw.string.markdown, markup.fenced_code.block.markdown | #0288b8 | — |
| punctuation.definition.list.begin.markdown | #c78500 | — |
| markup.quote.markdown, punctuation.definition.quote.begin.markdown | #4a4fd8 | italic |
| entity.name.function.decorator.python, meta.function.decorator.python, punctuation.definition.decorator.python | #c78500 | — |
| support.function.magic.python, support.variable.magic.python | #8a6a00 | — |
| meta.fstring.python, storage.type.format.python | #0e8a6e | — |
| punctuation.definition.lifetime.rust, entity.name.type.lifetime.rust, storage.modifier.lifetime.rust | #8a6a00 | — |
| entity.name.function.macro.rust, meta.macro.rust, support.function.macro.rust | #c78500 | — |
| meta.attribute.rust, punctuation.definition.attribute.rust, punctuation.brackets.attribute.rust | #4a4fd8 | — |
| entity.name.package.go | #0288b8 | — |
| entity.name.type.interface.go | #2a6fd8 | — |
| variable.other.php, punctuation.definition.variable.php | #2a6fd8 | — |
| support.class.php, entity.name.type.class.php | #0288b8 | — |
| variable.other.normal.shell, variable.other.special.shell, variable.other.positional.shell, punctuation.definition.variable.shell | #2a6fd8 | — |
| support.function.builtin.shell, entity.name.command.shell | #1f7ec4 | — |
| keyword.other.special-method.dockerfile, keyword.control.dockerfile | #c78500 | — |
| entity.name.type.graphql, support.type.graphql | #0288b8 | — |
| variable.graphql, entity.name.fragment.graphql | #2a6fd8 | — |
| entity.name.function.directive.graphql, punctuation.definition.directive.graphql | #c78500 | — |
| entity.name.type.model.prisma, entity.name.type.enum.prisma | #0288b8 | — |
| variable.other.member.prisma, entity.name.field.prisma | #2a6fd8 | — |
| entity.name.function.attribute.prisma, punctuation.definition.attribute.prisma | #c78500 | — |
Full workbench mockup using this variant's colors and tokenColors.
Loading...
Workbench UI color keys from the theme JSON colors map.
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment, fenced_code.block.language.markdown | #7a8caacc | italic |
| punctuation.definition.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, meta.tag, punctuation.separator.inheritance.php, keyword.other.template, keyword.other.substitution, meta.arrow, storage.type.function.arrow, keyword.operator.assignment, punctuation.terminator.rule.css, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded.begin, punctuation.section.embedded.end | #9aacdb | — |
| variable, variable.other, variable.other.readwrite, variable.other.object, string constant.other.placeholder, meta.block variable.other, entity.name.method, variable.function.constructor, markup.changed, constant.character.escape, markup.inline.raw.string.markdown, entity.other.attribute-name.class.css, entity.other.inherited-class.ruby, keyword.control.pseudo-method.ruby, entity.name.variable.parameter.python, variable.parameter.function.python, variable.other.property, support.variable | #66ccff | — |
| keyword, keyword.control, keyword.operator, storage.type, storage.modifier, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other, markup.heading, markup.inserted.git_gutter, entity.other.attribute-name | #ffffff | — |
| entity.name.function, meta.function-call, variable.function, support.function, entity.name.tag, entity.name, keyword.control.flow, keyword.control.conditional, keyword.control.loop, keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.return, keyword.control.async, keyword.control.await, keyword.control.try, keyword.control.except, keyword.control.raise, invalid, invalid.illegal, markup.deleted.git_gutter, markup.changed.git_gutter, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, support.type.sys-types | #ff1a6e | — |
| string, string.quoted, string.quoted.single, string.quoted.double, string.quoted.triple, string.template, string.regexp, string.interpolated, entity.other.attribute-name.pseudo-class.css, entity.other.inherited-class, keyword.other.special-method, markup.inserted.git_gutter, variable.language | #0099ff | — |
| constant.numeric, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.octal, constant.numeric.binary, tag.decorator entity.name.tag, tag.decorator punctuation.definition.tag, entity.name.decorator, keyword.operator.logical, constant.language.symbol.ruby, constant.other.color, constant.other.symbol, constant.other.key, punctuation.definition.annotation, storage.type.annotation | #ffe600 | — |
| markup.bold, markup.bold string, entity.name, entity.other.inherited-class, entity.other.attribute-name.class.css, keyword.other.important.css, keyword.other.important.scss, support.class, support.class.ruby | — | bold |
| markup.italic, comment | — | italic |
| markup.underline, *url*, *link*, *uri* | — | underline |
| text.html.markdown, punctuation.definition.list_item.markdown, markup.italic | #dddddd | — |
| meta.import, punctuation.terminator.statement, keyword.control.import, keyword.control.from | #7a8caacc | — |
| string.other.link.title.markdown, constant.other.reference.link.markdown | #66ccff | — |
| markup.quote, markup.quote punctuation.definition.blockquote.markdown, meta.separator, markup.table | #aabbdd | italic |
| markup.raw.block | #cccccc | — |
| markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold | #cccccc | bold italic |
| support.type, 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 | #aabbdd | — |
| entity.other.attribute-name.id.css, entity.other.attribute-name.id, entity.name.tag.css | #ff1a6e | — |
| support.constant.property-value.css, support.constant.font-name.css, support.constant.media-type.media.css, support.constant.media.css, constant.other.color.rgb-value.css, constant.other.color.rgb-value.hex.css | #0099ff | — |
| keyword.other.unit.px.css, keyword.other.unit.em.css, keyword.other.unit.rem.css, keyword.other.unit.vh.css, keyword.other.unit.vw.css, keyword.other.unit.pt.css, keyword.other.unit.percent.css, keyword.other.unit.css | #ffe600 | — |
| keyword.other.sql, keyword.other.DML.sql, keyword.other.DDL.sql, keyword.other.DML.II.sql, keyword.other.create.sql, keyword.other.drop.sql, keyword.other.select.sql, keyword.other.insert.sql, keyword.other.update.sql, keyword.other.delete.sql, keyword.other.where.sql, keyword.other.from.sql, keyword.other.join.sql, keyword.other.on.sql, keyword.other.as.sql, keyword.other.order.sql, keyword.other.group.sql, keyword.other.by.sql, keyword.other.having.sql, keyword.other.limit.sql, keyword.other.offset.sql, keyword.other.union.sql, keyword.other.into.sql, keyword.other.values.sql, keyword.other.set.sql, keyword.other.table.sql, support.function.aggregate.sql, support.function.window.sql | #ff1a6e | bold |
| storage.type.sql, support.type.sql | #66ccff | — |
| support.function.sql, support.function.scalar.sql, support.function.string.sql, support.function.datetime.sql, support.function.mathematical.sql | #ffe600 | — |
| keyword.operator.sql, keyword.operator.comparison.sql, keyword.operator.logical.sql, keyword.operator.star.sql | #ffffff | — |
| entity.name.tag.xml, entity.name.tag.localname.xml, entity.name.tag.namespace.xml | #ff1a6e | — |
| entity.other.attribute-name.xml, entity.other.attribute-name.localname.xml, entity.other.attribute-name.namespace.xml | #66ccff | — |
| entity.name.tag.namespace.prefix.xml, entity.other.attribute-name.namespace.prefix.xml | #ffe600 | — |
| entity.name.tag.yaml, support.type.property-name.yaml | #ff1a6e | — |
| string.unquoted.yaml, string.quoted.single.yaml, string.quoted.double.yaml | #0099ff | — |
| entity.name.type.anchor.yaml, variable.other.alias.yaml, punctuation.definition.alias.yaml | #ffe600 | — |
| support.type.property-name.table.toml, entity.name.section.group-title.toml | #ff1a6e | bold |
| support.type.property-name.toml | #66ccff | — |
| support.type.property-name.json | #ff1a6e | — |
| string.quoted.double.json | #0099ff | — |
| entity.name.function.decorator.python, punctuation.definition.decorator.python | #ffe600 | italic |
| variable.parameter.function.language.special.self.python, variable.parameter.function.language.special.cls.python | #ff1a6e | italic |
| support.function.magic.python | #66ccff | — |
| entity.name.function.macro.rust, entity.name.function.macro.rules.rust | #ffe600 | — |
| storage.modifier.lifetime.rust, entity.name.type.lifetime.rust | #ff1a6e | italic |
| entity.name.package.go | #ffe600 | — |
| storage.type.go, support.type.builtin.go, entity.name.type.go | #66ccff | — |
| variable.other.php, punctuation.definition.variable.php | #66ccff | — |
| variable.other.normal.shell, variable.other.positional.shell, variable.other.bracket.shell, punctuation.definition.variable.shell | #66ccff | — |
| support.function.builtin.shell, entity.name.command.shell | #ff1a6e | — |
| keyword.other.special-method.dockerfile, keyword.control.dockerfile | #ff1a6e | bold |
| support.type.graphql, entity.name.type.graphql | #66ccff | — |
| variable.graphql, entity.name.fragment.graphql | #ffe600 | — |
| entity.name.type.model.prisma, entity.name.type.enum.prisma | #ff1a6e | bold |
| variable.other.assignment.prisma | #66ccff | — |
| support.type.primitive.prisma, entity.name.type.prisma | #ffe600 | — |
Full workbench mockup using this variant's colors and tokenColors.
Loading...
Workbench UI color keys from the theme JSON colors map.
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment, fenced_code.block.language.markdown | #8a9ab5aa | italic |
| punctuation.definition.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, meta.tag, punctuation.separator.inheritance.php, keyword.other.template, keyword.other.substitution, meta.arrow, storage.type.function.arrow, keyword.operator.assignment, punctuation.terminator.rule.css, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded.begin, punctuation.section.embedded.end | #4a5568 | — |
| variable, variable.other, variable.other.readwrite, variable.other.object, string constant.other.placeholder, meta.block variable.other, entity.name.method, variable.function.constructor, markup.changed, constant.character.escape, markup.inline.raw.string.markdown, entity.other.attribute-name.class.css, entity.other.inherited-class.ruby, keyword.control.pseudo-method.ruby, entity.name.variable.parameter.python, variable.parameter.function.python, variable.other.property, support.variable | #0088cc | — |
| keyword, keyword.control, keyword.operator, storage.type, storage.modifier, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other, markup.heading, markup.inserted.git_gutter, entity.other.attribute-name | #1a1f2e | — |
| entity.name.function, meta.function-call, variable.function, support.function, entity.name.tag, entity.name, keyword.control.flow, keyword.control.conditional, keyword.control.loop, keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.return, keyword.control.async, keyword.control.await, keyword.control.try, keyword.control.except, keyword.control.raise, invalid, invalid.illegal, markup.deleted.git_gutter, markup.changed.git_gutter, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, support.type.sys-types | #ff006a | — |
| string, string.quoted, string.quoted.single, string.quoted.double, string.quoted.triple, string.template, string.regexp, string.interpolated, entity.other.attribute-name.pseudo-class.css, entity.other.inherited-class, keyword.other.special-method, markup.inserted.git_gutter, variable.language | #5a9e00 | — |
| constant.numeric, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.octal, constant.numeric.binary, tag.decorator entity.name.tag, tag.decorator punctuation.definition.tag, entity.name.decorator, keyword.operator.logical, constant.language.symbol.ruby, constant.other.color, constant.other.symbol, constant.other.key, punctuation.definition.annotation, storage.type.annotation | #c08000 | — |
| markup.bold, markup.bold string, entity.name, entity.other.inherited-class, entity.other.attribute-name.class.css, keyword.other.important.css, keyword.other.important.scss, support.class, support.class.ruby | — | bold |
| markup.italic, comment | — | italic |
| markup.underline, *url*, *link*, *uri* | — | underline |
| text.html.markdown, punctuation.definition.list_item.markdown, markup.italic | #2d3748 | — |
| meta.import, punctuation.terminator.statement, keyword.control.import, keyword.control.from | #8a9ab5aa | — |
| string.other.link.title.markdown, constant.other.reference.link.markdown | #0088cc | — |
| markup.quote, markup.quote punctuation.definition.blockquote.markdown, meta.separator, markup.table | #4a5568 | italic |
| support.type, 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 | #4a5568 | — |
| entity.other.attribute-name.id.css, entity.other.attribute-name.id, entity.name.tag.css | #ff006a | — |
| support.constant.property-value.css, support.constant.font-name.css, support.constant.media-type.media.css, support.constant.media.css, constant.other.color.rgb-value.css, constant.other.color.rgb-value.hex.css | #5a9e00 | — |
| keyword.other.unit.px.css, keyword.other.unit.em.css, keyword.other.unit.rem.css, keyword.other.unit.vh.css, keyword.other.unit.vw.css, keyword.other.unit.pt.css, keyword.other.unit.percent.css, keyword.other.unit.css | #c08000 | — |
| keyword.other.sql, keyword.other.create.sql, keyword.other.drop.sql, keyword.other.select.sql, keyword.other.insert.sql, keyword.other.update.sql, keyword.other.delete.sql, keyword.other.where.sql, keyword.other.from.sql, keyword.other.join.sql, keyword.other.on.sql, keyword.other.as.sql, keyword.other.order.sql, keyword.other.group.sql, keyword.other.by.sql, keyword.other.having.sql, keyword.other.limit.sql, keyword.other.offset.sql, keyword.other.union.sql, keyword.other.intersect.sql, keyword.other.except.sql, keyword.other.into.sql, keyword.other.values.sql, keyword.other.set.sql, keyword.other.table.sql, keyword.other.database.sql, keyword.other.index.sql, keyword.other.primary.sql, keyword.other.foreign.sql, keyword.other.key.sql, keyword.other.references.sql, keyword.other.constraint.sql, keyword.other.not.sql, keyword.other.null.sql, keyword.other.unique.sql, keyword.other.default.sql, keyword.other.check.sql, keyword.other.transaction.sql, keyword.other.begin.sql, keyword.other.commit.sql, keyword.other.rollback.sql, keyword.other.grant.sql, keyword.other.revoke.sql, keyword.other.procedure.sql, keyword.other.function.sql, keyword.other.trigger.sql, keyword.other.view.sql, keyword.other.alter.sql, support.function.aggregate.sql, support.function.window.sql | #ff006a | bold |
| storage.type.sql, storage.type.numeric.sql, storage.type.string.sql, storage.type.date.sql, keyword.other.type.sql | #0088cc | — |
| entity.name.function.sql, meta.toc-list.id.sql, variable.other.table.sql, variable.other.column.sql, constant.other.database-name.sql, constant.other.table-name.sql | #1a1f2e | — |
| support.function.scalar.sql, support.function.string.sql, support.function.numeric.sql, support.function.date.sql | #c08000 | — |
| entity.name.tag.xml, entity.name.tag.localname.xml, meta.tag.xml | #ff006a | — |
| entity.other.attribute-name.xml, entity.other.attribute-name.localname.xml, entity.other.attribute-name.namespace.xml | #0088cc | — |
| entity.name.tag.namespace.xml, entity.other.attribute-name.namespace.xml, variable.other.documentroot.xml | #c08000 | — |
| meta.tag.preprocessor.xml, punctuation.definition.tag.xml | #4a5568 | — |
| entity.name.tag.yaml, string.unquoted.plain.out.yaml, string.unquoted.block.yaml, punctuation.definition.block.sequence.item.yaml | #0088cc | — |
| string.quoted.single.yaml, string.quoted.double.yaml, string.unquoted.plain.in.yaml | #5a9e00 | — |
| entity.name.type.anchor.yaml, variable.other.alias.yaml, punctuation.definition.anchor.yaml, punctuation.definition.alias.yaml | #c08000 | — |
| constant.language.boolean.yaml, constant.language.null.yaml, constant.language.yaml | #ff006a | — |
| keyword.key.toml, support.type.property-name.toml, variable.other.key.toml | #0088cc | — |
| string.quoted.single.toml, string.quoted.double.toml, string.quoted.triple.toml | #5a9e00 | — |
| entity.name.section.group-title.toml, support.type.property-name.table.toml | #ff006a | bold |
| constant.numeric.toml, constant.language.boolean.toml, constant.language.null.toml | #c08000 | — |
| meta.structure.dictionary.json support.type.property-name.json | #ff006a | — |
| meta.structure.dictionary.json meta.structure.dictionary.json support.type.property-name.json | #0088cc | — |
| meta.structure.dictionary.json meta.structure.dictionary.json meta.structure.dictionary.json support.type.property-name.json | #5a9e00 | — |
| meta.structure.dictionary.json meta.structure.dictionary.json meta.structure.dictionary.json meta.structure.dictionary.json support.type.property-name.json | #c08000 | — |
| meta.structure.dictionary.value.json string.quoted.double.json | #4a5568 | — |
| meta.structure.dictionary.value.json constant.numeric.json, meta.structure.dictionary.value.json constant.language.json | #c08000 | — |
| meta.decorator.python, entity.name.function.decorator.python, punctuation.definition.decorator.python | #c08000 | italic |
| variable.language.special.self.python | #ff006a | italic |
| support.type.python, meta.function.parameters.annotated.python, meta.function.return-type.python | #0088cc | — |
| storage.modifier.lifetime.rust, entity.name.lifetime.rust, punctuation.definition.lifetime.rust | #c08000 | italic |
| meta.macro.rust, entity.name.function.macro.rust, support.function.macro.rust | #ff006a | — |
| entity.name.type.rust, support.type.primitive.rust, entity.name.struct.rust, entity.name.enum.rust, entity.name.trait.rust | #0088cc | — |
| entity.name.package.go, support.other.namespace.go | #0088cc | — |
| entity.name.function.go | #ff006a | — |
| entity.name.type.go, support.type.builtin.go | #0088cc | — |
| variable.other.php, variable.language.this.php | #0088cc | — |
| support.class.php, entity.name.class.php, entity.name.type.class.php | #0088cc | bold |
| support.function.magic.php | #ff006a | italic |
| support.type.graphql, entity.name.type.graphql | #0088cc | — |
| variable.graphql, meta.selectionset.graphql variable.graphql | #1a1f2e | — |
| entity.name.directive.graphql | #c08000 | — |
| keyword.operation.graphql, entity.name.fragment.graphql | #ff006a | — |
| keyword.other.special-method.dockerfile, entity.name.function.dockerfile, support.function.dockerfile | #ff006a | bold |
| variable.other.normal.shell, variable.other.bracket.shell, variable.other.special.shell | #0088cc | — |
| support.function.builtin.shell, keyword.other.shell | #ff006a | — |
| entity.name.type.model.prisma, entity.name.type.enum.prisma | #0088cc | bold |
| variable.other.field.prisma | #1a1f2e | — |
| support.function.attribute.prisma | #c08000 | — |
export interface User {
id: string;
name: string;
role: "admin" | "member";
tags: string[];
}
/**
* Fetch user data by ID
* @param id
* @returns User object or null if ID is invalid
*/
export async function fetchUser(id: string): Promise<User | null> {
if (!id) {
return null;
}
const response = await fetch(`/api/users/${id}`, {
method: "GET",
headers: { Accept: "application/json" },
});
if (!response.ok) {
throw new Error(`HTTP ${response.status}`);
}
return (await response.json()) as User;
}
function greet(user: User): string {
// Simple greeting function that uses the user's name
return `Hello, ${user.name}!`;
}
export interface User {
id: string;
name: string;
role: "admin" | "member";
tags: string[];
}
/**
* Fetch user data by ID
* @param id
* @returns User object or null if ID is invalid
*/
export async function fetchUser(id: string): Promise<User | null> {
if (!id) {
return null;
}
const response = await fetch(`/api/users/${id}`, {
method: "GET",
headers: { Accept: "application/json" },
});
if (!response.ok) {
throw new Error(`HTTP ${response.status}`);
}
return (await response.json()) as User;
}
function greet(user: User): string {
// Simple greeting function that uses the user's name
return `Hello, ${user.name}!`;
}
export interface User {
id: string;
name: string;
role: "admin" | "member";
tags: string[];
}
/**
* Fetch user data by ID
* @param id
* @returns User object or null if ID is invalid
*/
export async function fetchUser(id: string): Promise<User | null> {
if (!id) {
return null;
}
const response = await fetch(`/api/users/${id}`, {
method: "GET",
headers: { Accept: "application/json" },
});
if (!response.ok) {
throw new Error(`HTTP ${response.status}`);
}
return (await response.json()) as User;
}
function greet(user: User): string {
// Simple greeting function that uses the user's name
return `Hello, ${user.name}!`;
}
export interface User {
id: string;
name: string;
role: "admin" | "member";
tags: string[];
}
/**
* Fetch user data by ID
* @param id
* @returns User object or null if ID is invalid
*/
export async function fetchUser(id: string): Promise<User | null> {
if (!id) {
return null;
}
const response = await fetch(`/api/users/${id}`, {
method: "GET",
headers: { Accept: "application/json" },
});
if (!response.ok) {
throw new Error(`HTTP ${response.status}`);
}
return (await response.json()) as User;
}
function greet(user: User): string {
// Simple greeting function that uses the user's name
return `Hello, ${user.name}!`;
}