Elegant and modern Deep Purple scheme theme with colorful schemes for JavaScript, TypeScript, Python, C, C++, HTML, CSS, Go, Java, React, Astro, Prisma, Markdown, YAML, TOML, JSON, and more to come soon.
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 |
|---|---|---|
| #dac7fc | — | |
| #ccb5ff | — | |
| punctuation.definition.string.begin, punctuation.definition.string.end, storage, keyword | #ae89ff | — |
| #e484fc | — | |
| variable.parameter | #f0a6ff | — |
| punctuation.separator.key-value, keyword.other.unit | #ff66a6 | — |
| punctuation.separator.key-value, keyword.other.unit | #ee80ff | — |
| constant.numeric | #ffbba6 | — |
| #ff9494 | — | |
| keyword.operator | #ebce99 | — |
| string | #A1E2B7 | — |
| comment | #5DAF6F | — |
| comment.block.documentation | #7dc1d6 | — |
| entity.name.method | #94b9ff | — |
| text.html.derivative | #ccb5ff | — |
| punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, meta.tag.structure.body.start.html, meta.tag.structure.body.end.html | #ae89ff | — |
| entity.name.tag | #ff66a6 | — |
| string.quoted.double.html | #A1E2B7 | — |
| meta.tag, entity.other.attribute-name.html | #94b9ff | — |
| meta.jsx.children.tsx, meta.jsx.children.jsx, variable.other.readwrite.tsx, variable.other.readwrite.jsx, variable.other.object.tsx, variable.other.object.jsx | #dac7fc | — |
| meta.function-call.tsx, meta.function-call.jsx, keyword.operator.new.tsx, keyword.operator.new.jsx, punctuation.definition.string.template.begin.tsx, punctuation.definition.string.template.begin.jsx, punctuation.definition.string.template.end.tsx, punctuation.definition.string.template.end.jsx, keyword.operator.type.annotation.tsx, keyword.operator.type.annotation.jsx, punctuation.terminator.statement.tsx, punctuation.terminator.statement.jsx, storage.type.function.tsx, storage.type.function.jsx, keyword.control.default.tsx, keyword.control.default.jsx, meta.tag.attributes.tsx, meta.tag.attributes.jsx, punctuation.separator.comma.tsx, punctuation.separator.comma.jsx, punctuation.definition.template-expression.begin.tsx, punctuation.definition.template-expression.begin.jsx, punctuation.definition.template-expression.end.tsx, punctuation.definition.template-expression.end.jsx, punctuation.accessor.tsx, punctuation.accessor.jsx, punctuation.definition.tag.begin.tsx, punctuation.definition.tag.end.tsx, punctuation.definition.tag.begin.jsx, punctuation.definition.tag.end.jsx | #ae89ff | — |
| #e484fc | — | |
| meta.embedded.line.tsx, meta.embedded.line.jsx, variable.parameter.tsx, variable.parameter.jsx | #f0a6ff | — |
| keyword.operator.assignment.tsx | #ee80ff | — |
| keyword.control.export.tsx, keyword.control.export.jsx, variable.other.object.property.tsx, entity.name.type.module.tsx, entity.name.type.module.jsx, variable.other.property.tsx, variable.other.property.jsx, keyword.operator.type.tsx, keyword.operator.type.jsx, storage.type.function.arrow.tsx, storage.type.function.arrow.jsx, punctuation.definition.block.tsx, punctuation.definition.block.jsx, punctuation.definition.parameters.begin.tsx, punctuation.definition.parameters.end.tsx, punctuation.definition.parameters.begin.jsx, punctuation.definition.parameters.end.jax, punctuation.definition.binding-pattern.object.tsx, punctuation.definition.binding-pattern.object.jsx, meta.brace.round.tsx, meta.brace.round.jsx, meta.brace.square.tsx, meta.brace.square.jsx, punctuation.definition.typeparameters.begin.tsx, punctuation.definition.typeparameters.begin.tsx, punctuation.definition.typeparameters.end.jsx, punctuation.definition.typeparameters.end.jsx, punctuation.section.embedded.begin.tsx, punctuation.section.embedded.end.tsx, punctuation.section.embedded.begin.jsx, punctuation.section.embedded.end.jsx | #ff66a6 | — |
| constant.numeric.decimal.tsx, constant.numeric.decimal.jsx, constant.language.boolean.false.tsx, constant.language.boolean.false.jsx, constant.language.boolean.true.tsx, constant.language.boolean.true.jsx, constant.language.null.tsx, constant.language.null.jsx, constant.language.undefined.tsx, constant.language.undefined.jsx | #ff9494 | — |
| variable.object.property.tsx, variable.object.property.jsx, variable.other.property.tsx, variable.other.property.jsx | #ffbba6 | — |
| string.template.tsx, string.template.jsx | #a1e2dd | — |
| meta.interface.tsx, meta.interface.jsx, entity.name.type.tsx, entity.name.type.jsx, support.type.primitive.tsx, support.type.primitive.jsx, meta.import.tsx, meta.import.jsx, support.class.component.tsx, support.class.component.jsx, support.type.builtin.tsx, support.type.builtin.jsx | #ebce99 | — |
| variable.other.constant.property.tsx, variable.other.constant.property.jsx, meta.embedded.expression.tsx, meta.embedded.expression.jsx, entity.name.function.tsx, entity.name.function.jsx, entity.other.attribute-name.tsx, entity.other.attribute-name.jsx | #94b9ff | — |
| meta.embedded.expression.astro | #ccb5ff | — |
| punctuation.definition.tag.begin.astro, punctuation.definition.tag.end.astro | #ae89ff | — |
| punctuation.separator.key-value.astro, punctuation.section.embedded.begin.astro, punctuation.section.embedded.end.astro | #ff66a6 | — |
| support.class.component.astro, meta.embedded.expression.astro | #ebce99 | — |
| support.type.property-name.css | #ccb5ff | — |
| punctuation.separator.key-value.css, variable.parameter.keyframe-list.css, entity.other.attribute-name.class.css, punctuation.separator.list.comma.css, punctuation.terminator.rule.css | #ae89ff | — |
| variable.css, variable.argument.css | #f0a6ff | — |
| keyword.control.at-rule.keyframes.css, keyword.other.important.css, punctuation.definition.constant.css, support.constant.property-value.css, punctuation.definition.entity.css | #ff66a6 | — |
| meta.selector.css | #ee80ff | — |
| keyword.other.unit.px.css, keyword.other.unit.percentage.css, keyword.other.unit.em.css, keyword.other.unit.rem.css, keyword.other.unit.s.css, keyword.other.unit.deg.css, variable.parameter.misc.css | #ff9494 | — |
| entity.other.attribute-name.id.css, constant.numeric.css, constant.other.color.rgb-value.hex.css, meta.property-list.css, support.constant.font-name.css | #ffbba6 | — |
| support.function.misc.css | #ebce99 | — |
| support.constant.color.w3c-standard-color-name.css | #a1e2dd | — |
| comment.block.css | #7dc1d6 | — |
| entity.other.keyframe-offset.percentage.css, support.function.gradient.css, support.function.misc.css | #94b9ff | — |
| variable.other.constant.ts, variable.other.constant.js, meta.function.expression.js, meta.function.expression.ts, variable.other.object.ts, variable.other.object.js, meta.definition.variable.ts, meta.definition.variable.js, variable.other.readwrite.ts, variable.other.readwrite.js | #ccb5ff | — |
| meta.block.ts, meta.block.js, support.function.ts, support.function.js, support.variable.property.ts, support.variable.property.js, keyword.operator.type.annotation.ts, keyword.operator.type.annotation.js, punctuation.separator.key-value.ts, punctuation.separator.key-value.js, punctuation.definition.string.template.begin.ts, punctuation.definition.string.template.begin.js, punctuation.definition.string.template.end.ts, punctuation.definition.string.template.end.js, keyword.operator.new.ts, keyword.operator.new.js, punctuation.separator.comma.ts, punctuation.separator.comma.js, punctuation.terminator.statement.ts, punctuation.terminator.statement.js, keyword.control.flow.ts, keyword.control.flow.js, storage.type.function.ts, storage.type.function.js, keyword.control.import.ts, keyword.control.import.js, keyword.control.from.ts, keyword.control.from.js, keyword.operator.expression.instanceof.ts, keyword.operator.expression.instanceof.js, keyword.operator.expression.typeof.ts, keyword.operator.expression.typeof.js, meta.parameters.ts, meta.parameters.js, punctuation.accessor.ts, punctuation.accessor.js, keyword.control.as.ts, punctuation.definition.template-expression.begin.ts, punctuation.definition.template-expression.begin.js, punctuation.definition.template-expression.end.ts, punctuation.definition.template-expression.end.js | #ae89ff | — |
| #e484fc | — | |
| variable.parameter.ts, variable.parameter.js | #f0a6ff | — |
| variable.other.object.property.ts, variable.other.object.property.js, keyword.control.export.ts, keyword.control.export.js, keyword.control.type.ts, keyword.control.type.js, keyword.operator.type.ts, keyword.operator.type.js, storage.type.function.arrow.js, storage.type.function.arrow.ts, punctuation.definition.block.ts, punctuation.definition.block.js, meta.var.expr.ts, meta.var.expr.js, meta.brace.square.ts, meta.brace.square.js, variable.language.this.ts, variable.language.this.js, meta.brace.round.ts, meta.brace.round.js | #ff66a6 | — |
| meta.object-literal.key.ts, variable.other.property.ts, variable.other.property.js, variable.other.object.property.ts, variable.other.object.property.js | #ffbba6 | — |
| meta.objectliteral.ts, meta.objectliteral.js, variable.object.property.ts, variable.object.property.js, constant.language.boolean.true.ts, constant.language.boolean.true.js, constant.language.boolean.false.ts, constant.language.boolean.false.js, constant.character.escape.ts, constant.character.escape.js, entity.name.type.ts | #ff9494 | — |
| meta.import.ts, meta.import.js, meta.function.ts, support.type.primitive.ts, entity.name.type.alias.ts, variable.other.readwrite.alias.ts, variable.other.readwrite.alias.js, constant.numeric.decimal.ts, constant.numeric.decimal.js, support.type.builtin.ts, punctuation.accessor.optional.ts, punctuation.accessor.optional.js, entity.name.type.module.ts, entity.name.type.module.js | #ebce99 | — |
| string.template.ts, string.template.js | #a1e2dd | — |
| meta.function-call.ts, meta.function-call.js, variable.other.constant.property.ts, variable.other.constant.property.js, meta.definition.function.ts, meta.definition.function.js, entity.name.function.ts, entity.name.function.js | #94b9ff | — |
| punctuation.definition.decorator.python, punctuation.section.function.begin.python, punctuation.separator.colon.python, punctuation.separator.annotation.python, punctuation.separator.arguments.python, punctuation.section.class.begin.python, punctuation.separator.parameters.python, punctuation.separator.period.python, punctuation.separator.annotation.result.python, punctuation.separator.inheritance.python, punctuation.separator.element.python, punctuation.definition.string.being.python, punctuation.definition.string.end.python, keyword.operator.bitwise.python, punctuation.separator.dict.python, docstring.variable.identifier.sphinx.python, docstring.snippet.begin.python, docstring.snippet.end.python, docstring.heading.end.python, docstring.variable.placeholder.google.python, docstring.directive.begin.python, docstring.directive.end.python, docstring.identifier.begin.python, docstring.identifier.end.python, docstring.literal.begin.python, docstring.literal.end.python, docstring.type.begin.google.python, docstring.type.end.google.python, constant.character.format.placeholder.other.python | #ae89ff | — |
| docstring.snippet.placeholder.function.python, meta.function-call.arguments.python, docstring.snippet.placeholder.python, docstring.variable.placeholder.google.python, docstring.variable.placeholder.sphinx.python, docstring.variable.placeholder.numpy.python | #f0a6ff | — |
| punctuation.definition.parameters.begin.python, punctuation.definition.parameters.end.python, meta.item-access.python, docstring.heading.placeholder.python, docstring.snippet.begin.variable.python, docstring.snippet.end.variable.python, docstring.snippet.begin.function.python, docstring.snippet.end.function.python | #ff66a6 | — |
| constant.numeric.dec.python, constant.numeric.hex.python, constant.numeric.oct.python | #ffbba6 | — |
| constant.language.python, constant.numeric.float.python, docstring.identifier.placeholder.python | #ff9494 | |
| constant.character.escape.python, support.type.python, meta.indexed-name.python, docstring.variable.end.google.python, docstring.literal.placeholder.python, docstring.snippet.placeholder.type.python, docstring.variable.begin.sphinx.python, docstring.variable.end.sphinx.python, docstring.variable.begin.numpy.python, docstring.variable.end.numpy.python, docstring.variable.begin.google.python, docstring.variable.end.google.python, docstring.type.placeholder.google.python | #ebce99 | — |
| docstring.snippet.placeholder.variable.python, string.quoted.single.python | #A1E2B7 | — |
| string.interpolated.python | #a1e2dd | — |
| string.quoted.docstring.multi.python | #7dc1d6 | — |
| entity.name.function.python, docstring.directive.placeholder.python | #94b9ff | — |
| punctuation.support.type.property-name.begin.json.comments, punctuation.support.type.property-name.end.json.comments, punctuation.separator.dictionary.key-value.json.comments, punctuation.separator.array.json.comments, punctuation.support.type.property-name.begin.json, punctuation.support.type.property-name.end.json, punctuation.separator.dictionary.pair.json.comments, punctuation.separator.dictionary.key-value.json, punctuation.separator.dictionary.pair.json, punctuation.separator.array.json | #ae89ff | — |
| support.type.property-name.json.comments, support.type.property-name.json, punctuation.definition.dictionary.begin.json, punctuation.definition.dictionary.end.json, punctuation.definition.array.begin.json, punctuation.definition.array.end.json | #ff66a6 | — |
| constant.numeric.json.comments, constant.numeric.json | #ffbba6 | — |
| constant.language.json.comments, constant.language.json | #ff9494 | — |
| string.quoted.double.json.comments | #A1E2B7 | — |
| variable.other.assignment.go, variable.other.go | #ccb5ff | — |
| entity.name.type.any.go, punctuation.other.comma.go, punctuation.other.colon.go, punctuation.other.period.go, punctuation.terminator.go, entity.name.function.support.builtin.go | #ae89ff | — |
| #e484fc | — | |
| variable.parameter.go | #f0a6ff | — |
| keyword.operator.address.go, constant.language.iota.go, entity.name.import.go, punctuation.definition.begin.bracket.round.go, punctuation.definition.end.bracket.round.go, punctuation.definition.begin.bracket.curly.go, punctuation.definition.end.bracket.curly.go, punctuation.definition.imports.begin.bracket.round.go, punctuation.definition.imports.end.bracket.round.go | #ff66a6 | — |
| #ee80ff | — | |
| variable.other.property.go, entity.name.type.package.go | #ffbba6 | — |
| entity.name.type.go, constant.language.null.go, constant.language.boolean.go | #ff9494 | — |
| keyword.operator.assignment.go, keyword.operator.arithmetic.go, storage.type.numeric.go, storage.type.string.go, storage.type.boolean.go, storage.type.byte.go, storage.type.error.go, storage.type.go | #ebce99 | — |
| string.quoted.double.go | #A1E2B7 | — |
| comment.line.double-slash.go | #5DAF6F | — |
| string.quoted.raw.go | #a1e2dd | — |
| #7dc1d6 | — | |
| entity.name.function.go, entity.name.function.support.go | #94b9ff | — |
| punctuation.definition.annotation.java, punctuation.terminator.java, punctuation.separator.period.java, punctuation.bracket.angle.java, punctuation.separator.delimiter.java | #ae89ff | — |
| storage.type.primitive.java, storage.type.primitive.array.java, variable.language.this.java | #ff66a6 | — |
| constant.numeric.decimal.java | #ff9494 | — |
| constant.language.java | #ffbba6 | — |
| comment.block.javadoc.java | #7dc1d6 | — |
| heading.1.markdown, heading.2.markdown, punctuation.definition.markdown, punctuation.definition.link.description.begin.markdown, punctuation.definition.link.description.end.markdown, punctuation.definition.link.title.begin.markdown, punctuation.definition.link.title.end.markdown, punctuation.definition.quote.begin.markdown | #ae89ff | — |
| heading.3.markdown, heading.4.markdown | #e484fc | — |
| heading.5.markdown, heading.6.markdown, markup.quote.markdown | #f0a6ff | — |
| fenced_code.block.language.markdown, string.other.link.title.markdown, markup.bold.markdown, markup.heading.setext.1.markdown, markup.heading.setext.2.markdown | #ff66a6 | — |
| string.other.link.title.markdown | #ff9494 | — |
| markup.underline.link.markdown | #ffbba6 | — |
| markup.underline.link.image.markdown | #ebce99 | — |
| markup.inline.raw.string.markdown | #7dc1d6 | — |
| entity.name.command.shell, markup.list.unnumbered.markdown | #94b9ff | — |
| string.unquoted.plain.out.yaml | #ccb5ff | — |
| entity.other.document.begin.yaml, entity.other.document.end.yaml, punctuation.separator.map.value.yaml, punctuation.definition.block.sequence.item.yaml, punctuation.separator.sequence.yaml, punctuation.separator.mapping.yaml | #ae89ff | — |
| constant.character.escape.yaml, string.unquoted.plain.in.yaml | #f0a6ff | — |
| constant.language.boolean.yaml, constant.numeric.float.inf.yaml, constant.numeric.float.nan.yaml, constant.language.null.yaml | #ff9494 | — |
| constant.numeric.integer.decimal.yaml, meta.flow.map.key.yaml | #ffbba6 | — |
| constant.numeric.float.yaml | #ebce99 | — |
| keyword.operator.optional_type.prisma, entity.name.function.attribute.prisma, punctuation.definition.separator.key-value.prisma, source.prisma.attribute.with_arguments | #ae89ff | — |
| support.constant.constant.prisma | #f0a6ff | — |
| entity.name.type.config.prisma, variable.parameter.key.prisma | #ff66a6 | — |
| support.type.primitive.prisma, constant.language.boolean.prisma | #ff9494 | — |
| variable.other.assignment.prisma | #ffbba6 | — |
| entity.name.type.model.prisma, variable.language.relations.prisma | #ebce99 | — |
| support.function.functional.prisma | #94b9ff | — |
| keyword.operator.bitwise.cpp, punctuation.terminator.statement.cpp, punctuation.separator.colon.range-based.cpp, constant.numeric.decimal.point.cpp, punctuation.separator.scope-resolution.cpp, punctuation.section.angle-brackets.begin.template.call.cpp, punctuation.section.angle-brackets.end.template.call.cpp, punctuation.separator.scope-resolution.function.call.cpp, punctuation.separator.delimiter.comma.cpp, meta.body.function.definition.cpp | #ae89ff | — |
| storage.type.namespace.directive.cpp, keyword.operator.comparison.cpp | #ff66a6 | — |
| constant.language.true.cpp, constant.language.false.cpp | #ff9494 | — |
| constant.character.escape, constant.numeric.decimal.cpp, keyword.operator.cast.static_cast.cpp | #ffbba6 | — |
| #ebce99 | — | |
| comment.block.documentation.cpp | #7dc1d6 | — |
| entity.name.function.definition.cpp | #94b9ff | — |
| constant.numeric.decimal.point.c, punctuation.terminator.statement.c, punctuation.separator.delimiter.c, constant.other.placeholder.c | #ae89ff | — |
| meta.parens.block.c | #ff66a6 | — |
| constant.language.c | #ff9494 | — |
| constant.numeric.decimal.c | #ffbba6 | — |
| comment.block.documentation.c | #7dc1d6 | — |
| support.type.property-name.table.toml, punctuation.definition.table.inline.toml | #ae89ff | — |
| support.type.property-name.toml, punctuation.separator.dot.toml, punctuation.definition.table.toml, punctuation.definition.array.toml, punctuation.definition.table.inline.toml | #ff66a6 | — |
| constant.language.boolean.toml | #ff9494 | — |
| punctuation.eq.toml, constant.numeric.float.toml, source.toml | #ebce99 | — |
| string.quoted.single.basic.line.toml | #A1E2B7 | — |
| comment.line.number-sign.toml | #5DAF6F | — |
| constant.other.time.datetime.offset.toml, constant.other.time.datetime.local.toml, constant.other.time.date.toml, constant.other.time.time.toml | #94b9ff | — |
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}!`;
}