Venture forth. Code in vivid colors. A high-contrast, readable theme with hexadic elemental accents across four coordinated variants: Dark, Light, High Contrast Dark, and High Contrast Light.
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, punctuation.definition.tag.html, comment.block.html | #A0A8B5 | italic |
| punctuation.definition.comment.begin, punctuation.definition.comment.end | #7C8696 | — |
| variable, string constant.other.placeholder | #FFFFFF | — |
| variable.parameter, variable.other.assignment | #FFFFFF | — |
| meta.block variable.other | #FFFFFF | — |
| support.other.variable | #B8C0A8 | — |
| string.other.link | #7BD0E8 | — |
| constant.other.color | #FFE070 | — |
| invalid, invalid.illegal, invalid.broken | #FF8A8A | bold |
| invalid.deprecated | #A0A8B5 | strikethrough |
| keyword, keyword.control, keyword.operator, keyword.other, keyword.other.special-method, keyword.other.unit, keyword.other.nameof.cs, keyword.other.typeof.cs, keyword.other.sizeof.cs, keyword.operator.expression.is.cs, keyword.operator.expression.typeof.cs, keyword.other.var.java, keyword.declaration.var.java, keyword.operator.wildcard.java, keyword.operator.diamond.java, keyword.other.diamond.java, storage.type.var.cs, storage.type.var, storage.type.var.java, keyword.other.special-method.dockerfile, keyword.other.dockerfile, keyword.control.dockerfile, keyword.control.from.dockerfile, keyword.other.from.dockerfile | #B0F0C8 | — |
| keyword.control, keyword.control.import, keyword.control.from, keyword.control.export, keyword.control.return, keyword.control.conditional, keyword.control.loop | #B0F0C8 | — |
| storage.type, storage.modifier, keyword.declaration | #B0F0C8 | — |
| storage.type.function, storage.type.function.ts, storage.type.function.tsx, storage.type.class, storage.type.class.ts, storage.type.class.tsx, storage.type.interface, storage.type.interface.ts, storage.type.interface.tsx, storage.type.enum, storage.type.enum.ts, storage.type.enum.tsx, storage.type.type-alias, storage.type.type-alias.ts, storage.type.type-alias.tsx | #B0F0C8 | — |
| keyword.operator.comparison, keyword.operator.logical, keyword.operator.arithmetic, keyword.operator.assignment, keyword.operator.ternary, keyword.operator.channel, keyword.operator.channel.go, keyword.operator.varargs.go, keyword.operator.arrow.go, keyword.operator.arrow.java, keyword.operator.coloncolon.java, keyword.operator.varargs.java, keyword.operator.wildcard.java, keyword.operator.spread.js, keyword.operator.rest.js, punctuation.spread.js, punctuation.separator.spread.js, punctuation.separator.arrow.java, punctuation.separator.coloncolon.java, punctuation.definition.typeparameters.begin.java, punctuation.definition.typeparameters.end.java | #B8C0A8 | — |
| keyword.operator.optional, keyword.operator.nullish | #B8C0A8 | — |
| punctuation, meta.brace, meta.bracket, meta.delimiter, meta.separator, meta.group.braces.curly, meta.group.braces.round, meta.group.braces.square, meta.group.braces.angle, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, punctuation.separator.inheritance.php | #D8DCD0 | — |
| support.class.component, support.class.component.tsx, support.class.component.jsx | #5DD8FF | — |
| entity.name.tag.html, entity.name.tag.match.html, meta.tag.sgml, meta.tag.sgml.html, entity.name.tag.tsx, entity.name.tag.jsx, meta.tag.tsx, meta.tag.jsx | #7BD0E8 | — |
| variable.other.property, variable.other.object.property, support.variable.property, meta.property, variable.other.readwrite.instance, variable.other.property.cs, variable.other.property.js, variable.other.property.private.js, variable.other.import.meta.js, support.variable.property.builtin.js, support.constant.property.builtin.js, variable.other.constant.js, variable.other.property.php, variable.other.property.ruby, variable.other.property.python, variable.other.property.rust, variable.other.property.swift, variable.other.property.typescript, variable.other.property.ts, variable.other.property.tsx, variable.other.property.dockerfile | #FF7310 | — |
| entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method | #FF7310 | bold |
| entity.name.function.definition, entity.name.function.ts, entity.name.function.tsx, entity.name.function.cs, entity.name.function.js, entity.name.function.php, entity.name.function.ruby, entity.name.function.rust, entity.name.function.swift, entity.name.function.python, entity.name.local.function.cs, meta.function.js entity.name.function.js, meta.class.method.js entity.name.function.js, meta.function.php entity.name.function.php, meta.class.php entity.name.function.php, meta.function.ruby entity.name.function.ruby, meta.class.ruby entity.name.function.ruby, meta.function.rust entity.name.function.rust, meta.function.swift entity.name.function.swift, meta.class.swift entity.name.function.swift, meta.function.python entity.name.function.python, meta.class.python entity.name.function.python, meta.function.declaration entity.name.function, meta.function.declaration.ts entity.name.function, meta.export.default entity.name.function | #5DD8FF | — |
| variable.parameter.function, meta.function.parameters, entity.name.variable.parameter.cs | #B8C0A8 | italic |
| constant.numeric, constant.character, constant.escape | #FF7310 | — |
| constant.language, constant.language.boolean, constant.language.null, constant.language.undefined, constant.language.python, constant.language.nan.js, constant.language.infinity.js, constant.language.nan, constant.language.infinity, support.constant | #FF7310 | italic |
| source.go storage.type, source.go support.type.builtin, source.java storage.type, source.c storage.type, source.cpp storage.type, source.cs storage.type, storage.type.primitive, storage.type.primitive.ts, storage.type.primitive.tsx, storage.type.rust, storage.type.swift, storage.type.java, storage.type.primitive.java, support.type.builtin, support.type.builtin.ts, support.type.builtin.tsx, support.type.builtin.python, support.type.builtin.java, support.type.builtin.go, support.type.builtin.php, support.type.builtin.swift, support.type.primitive.php, support.type.primitive.swift, support.type.primitive.js, support.class.builtin.js, support.class.builtin.php, support.class.builtin.python, support.class.builtin.ruby, support.class.builtin.swift, support.class.builtin.ts, support.constant.builtin.js, support.constant.builtin, support.constant.builtin.php, support.constant.builtin.python, support.function.builtin.js, support.function.builtin, support.function.builtin.php, support.function.builtin.python, support.variable.builtin.js, support.variable.builtin, support.type.java, support.type.dynamic.cs, keyword.type, keyword.type.ts, keyword.type.tsx, keyword.type.cs, keyword.type.java, keyword.type.js, keyword.type.swift, keyword.type.php, keyword.type.python, entity.name.macro.rust | #B0F0C8 | — |
| storage.type.accessor.get.cs, storage.type.accessor.set.cs, storage.type.accessor.init.cs, storage.type.accessor.add.cs, storage.type.accessor.remove.cs | #B0F0C8 | — |
| constant.character.escape, constant.character.string.escape | #FF7310 | — |
| string, constant.other.symbol, constant.other.key, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js | #FFE070 | — |
| string.quoted, string.quoted.single, string.quoted.double, string.quoted.triple, string.quoted.double.interpolated, string.quoted.double.interpolated.raw, string.quoted.single.interpolated, string.quoted.single.interpolated.raw, string.interpolated, string.quoted.raw.go, string.quoted.other.go, punctuation.definition.string, punctuation.definition.interpolation.begin, punctuation.definition.interpolation.end | #FFE070 | — |
| string.unquoted | #FFE070 | — |
| string.template, template.expression, punctuation.definition.template-expression | #FFFFFF | — |
| entity.name, entity.name.class, entity.name.type, entity.name.type.class, entity.name.type.interface, entity.name.type.alias, entity.name.interface, entity.name.interface.ts, entity.name.interface.tsx, entity.name.typealias, entity.name.namespace, entity.other.attribute-name.go, support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types | #5DD8FF | — |
| support.type.primitive, support.type.builtin, support.type.sys-types | #5DD8FF | — |
| entity.name.module.js, variable.import.parameter.js, variable.other.class.js | #5DD8FF | — |
| variable.language | #FFE070 | italic |
| entity.name.method.js, meta.class-method.js entity.name.function.js, variable.function.constructor | #5DD8FF | — |
| entity.name.import.go, constant.other.import.go, string.quoted.double.go | #FFE070 | — |
| source.java entity.name.type.java, source.java entity.name.type.class.java, source.java entity.name.type.interface.java, source.java entity.name.type.enum.java, source.java entity.name.type.record.java, source.java entity.name.type.annotation.java, source.java entity.other.inherited-class.java, source.java support.type.java | #FF7310 | — |
| entity.name.import.js, entity.name.imported.js, variable.other.import.js, support.type.import-module.js, support.constant.import-module.js, meta.import.js, punctuation.definition.string.begin.js, punctuation.definition.string.end.js | #FFE070 | — |
| entity.name.import.ts, entity.name.imported.ts, variable.other.import.ts, support.type.import-module.ts, support.constant.import-module.ts, meta.import.ts | #FFE070 | — |
| keyword.control.import.python, keyword.control.import.from.python, keyword.control.import.as.python, entity.name.imported.python, variable.other.import.python, variable.other.import.alias.python, punctuation.definition.string.begin.python, punctuation.definition.string.end.python | #FFE070 | — |
| constant.other.symbol.ruby, punctuation.definition.symbol.ruby, punctuation.definition.variable.ruby, variable.other.readwrite.instance.ruby, variable.other.readwrite.class.ruby, variable.other.readwrite.global.ruby, punctuation.definition.constant.ruby, punctuation.section.interpolation.begin.ruby, punctuation.section.interpolation.end.ruby | #FF7310 | — |
| entity.name.macro.rust, support.macro.rust, punctuation.definition.macro.rust, meta.macro.rust | #FFE070 | — |
| entity.name.import.java, constant.other.import.java, variable.other.import.java, meta.import.java, punctuation.separator.period.java | #FFE070 | — |
| entity.name.type.cs | #FF7310 | — |
| entity.other.attribute-name | #FF7310 | — |
| text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name | #7BD0E8 | — |
| entity.other.attribute-name.class, entity.other.attribute-name.id | #5DD8FF | — |
| 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, support.type.property-name | #B0F0C8 | — |
| markup.inserted, diff.inserted | #7BD0E8 | — |
| markup.deleted, diff.deleted | #FF8A8A | — |
| markup.changed, diff.changed | #7BD0E8 | — |
| string.regexp, string.regexp.source, constant.other.character-class.regexp | #FF7310 | — |
| constant.character.escape | #FF7310 | — |
| *url*, *link*, *uri* | — | underline |
| tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js, meta.decorator, punctuation.decorator, meta.annotation.java, punctuation.definition.annotation.java, entity.other.attribute-name.java, meta.annotation, punctuation.definition.annotation, meta.annotation.php, punctuation.definition.annotation.php, entity.name.attribute.php, meta.annotation.swift, punctuation.definition.annotation.swift, meta.attribute.swift, punctuation.definition.attribute.swift, entity.name.attribute.swift, meta.annotation.python, punctuation.definition.annotation.python, entity.name.decorator.python, meta.attribute.rust, punctuation.definition.attribute.rust, entity.name.attribute.rust | #FFE070 | italic |
| source.js constant.other.object.key.js string.unquoted.label.js | #B8C0A8 | — |
| source.json meta.structure.dictionary.json support.type.property-name.json, source.json meta.structure.dictionary.json string.quoted.key.json | #B0F0C8 | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #B0F0C8 | — |
| text.html.markdown, punctuation.definition.list_item.markdown | #FFFFFF | — |
| text.html.markdown markup.inline.raw.markdown | #FFE070 | — |
| text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown | #A0A8B5 | — |
| markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown | #7BD0E8 | — |
| markup.italic | #7BD0E8 | italic |
| markup.bold, markup.bold string | #7BD0E8 | — |
| 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 | #B0F0C8 | bold italic |
| markup.underline | #7BD0E8 | underline |
| markup.quote punctuation.definition.blockquote.markdown | #A0A8B5 | — |
| markup.quote | #A0A8B5 | italic |
| string.other.link.title.markdown | #7BD0E8 | — |
| string.other.link.description.title.markdown | #7BD0E8 | — |
| constant.other.reference.link.markdown | #7BD0E8 | — |
| markup.raw.block.fenced.markdown, punctuation.definition.fenced.markdown | #A0A8B5 | — |
| markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end | #FFFFFF | — |
| variable.language.fenced.markdown | #A0A8B5 | — |
| meta.separator | #A0A8B5 | bold |
| markup.raw.block | #FFE070 | — |
| markup.table | #FFFFFF | — |
| source.yaml entity.name.tag | #B0F0C8 | — |
| source.yaml string.unquoted | #FFE070 | — |
| source.sql keyword.other | #FF7310 | bold |
| source.sql string.quoted | #FFE070 | — |
| keyword.modifier.access, storage.modifier.ts | #FFB060 | — |
| keyword.modifier.readonly | #FFE070 | italic |
| keyword.import.type | #FF7310 | — |
| keyword.operator.as, keyword.operator.type | #B8C0A8 | — |
| keyword.satisfies | #FF7310 | — |
| variable.enum.member, constant.other.enum | #FFE070 | — |
| keyword.operator.expression.of, keyword.operator.expression.typeof, keyword.operator.expression.keyof, keyword.operator.expression.infer | #B8C0A8 | — |
| meta.decorator.ts, punctuation.decorator.ts | #FFE070 | italic |
| keyword.control.at-rule, punctuation.definition.keyword.css | #7BD0E8 | — |
| entity.other.attribute-name.pseudo-class, entity.other.attribute-name.pseudo-element | #B8C0A8 | — |
| keyword.other.important.css | #FF8A8A | bold |
| variable.css, variable.other.custom-property | #B0F0C8 | — |
| keyword.other.unit.css, punctuation.definition.unit.css | #A0A8B5 | — |
| variable.other.vendor | #A0A8B5 | — |
| variable.parameter.self.python, variable.language.self.python | #A0A8B5 | italic |
| support.type.python, entity.name.type.python | #5DD8FF | — |
| entity.name.function.decorator.python | #FFE070 | italic |
| markup.list.unnumbered.checkbox.unchecked | #A0A8B5 | — |
| markup.list.unnumbered.checkbox.checked | #B0F0C8 | — |
| markup.list.unnumbered.checkbox.partial, markup.list.unnumbered.task.partial | #B8C0A8 | italic |
| punctuation.definition.table.markdown | #B8C0A8 | — |
| entity.name.label, entity.name.label.cs, entity.name.label.php, entity.name.label.rust, entity.name.label.go, variable.other.label | #FFE070 | bold |
| entity.name.macro, entity.name.macro.rust, support.function.macro, support.macro, meta.macro | #FF7310 | bold |
| entity.other.inherited-class, entity.other.inherited-class.java, entity.other.inherited-class.cs, entity.other.inherited-class.php | #5DD8FF | italic |
| support.module, support.module.builtin, support.module.php, support.module.python | #B0F0C8 | — |
| variable.annotation, variable.annotation.js, variable.annotation.ts, variable.other.annotation | #FFE070 | italic |
| markup.inline.raw, text.html.markdown markup.inline.raw | #FFE070 | italic |
| markup.inserted.diff, markup.inserted.git_gutter.diff | #B0F0C8 | — |
| markup.deleted.diff, markup.deleted.git_gutter.diff | #FF8A8A | — |
| markup.changed.diff, markup.changed.git_gutter.diff | #7BD0E8 | — |
| variable.other.constant.property, variable.other.constant, support.constant.property | #FFE070 | — |
| constant.other.placeholder, variable.other.placeholder | #FFB060 | italic |
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}!`;
}