Twilight Sage
Publisher: James GullandThemes in package: 1
A modern VSCode theme filled with earthy neutrals, soft pastels, and touches of warm and cool.
A modern VSCode theme filled with earthy neutrals, soft pastels, and touches of warm and cool.
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 | #88807aB0 | italic |
| meta.parameters comment.block | #968E88 | italic |
| variable.other.constant.object, variable.other.readwrite.alias | #91c1d8 | — |
| variable.other, support.type.object | #E1DEE3 | — |
| variable.other.object.property, variable.other.property, support.variable.property, support.type.primitive | #E1DEE3 | — |
| .method, string.unquoted, meta.object.member | #F6AB79 | — |
| variable - meta.import, variable.other.readwrite.alias, constant.other.placeholder, meta.object-literal.key-meta.object.member | #E1DEE3 | — |
| keyword.control.flow, storage.modifier.async | #B480B0 | italic |
| keyword.operator.new, keyword.control.new, keyword.other | #f6ab79 | — |
| keyword.control.as | #f6ab79 | italic |
| variable.language.this, variable.language.super | #b480b0 | — |
| support.class.error, keyword.control.trycatch, keyword.operator.expression.delete, keyword.operator.expression.void, keyword.operator.void, keyword.operator.delete, constant.language.null, constant.language.boolean.false, constant.language.undefined | #FC8899 | — |
| variable.parameter, variable.object.property, variable.other.readwrite.js, meta.definition.variable variable.other.constant, meta.definition.variable variable.other.readwrite | #E1DEE3 | — |
| constant.other.color | #ffffff | — |
| invalid, invalid.illegal | #FC8899 | — |
| invalid.deprecated | #FC8899 | — |
| keyword.control, keyword | #968E88 | — |
| keyword.operator.assignment, keyword.operator.type.annotation, keyword.operator.type | #968E88 | — |
| keyword.operator, storage.type | #968E88 | — |
| keyword.control.import, storage.type.function.arrow | #b480b0 | — |
| storage.modifier, keyword.control.at-rule | #9ca989 | — |
| keyword.control.module | #9ca989 | italic |
| keyword.control.export | #b480b0 | italic |
| Keyword, Storage | — | italic |
| keyword-meta.export | #91c1d8 | — |
| meta.brace, punctuation, keyword.operator.existential | #968E88CC | — |
| constant.other.color, meta.tag, punctuation.separator.inheritance.php, keyword.other.template, keyword.other.substitution, meta.objectliteral | #E1DEE3 | — |
| support.class.component | #9ca989 | — |
| entity.name.tag, support.type.primitive, entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter | #9ca989 | — |
| variable.function, source meta.function-call entity.name.function, source meta.method-call entity.name.function, meta.class meta.group.braces.curly meta.function-call variable.function, meta.class meta.field.declaration meta.function-call entity.name.function, variable.function.constructor, meta.block meta.var.expr meta.function-call entity.name.function, support.function.console, meta.function-call support.function, meta.property.class variable.other.class | #B480B0 | — |
| meta.block meta.var.expr meta.function-call entity.name.function | #b480b0 | — |
| source meta.function-call entity.name.function | #b480b0 | — |
| entity.name.function, meta.class entity.name.class, meta.class entity.name.type.class, meta.class meta.function-call variable.function, keyword.other.important, entity.other.attribute-name.id.css, entity.other.attribute-name.class.css, variable.argument.css, meta.at-rule.media.header | #E1DEE3 | — |
| entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #f9e6d4 | — |
| meta.property-value.css, support.function.transform.css | #9ca989 | — |
| support.type.property-name.css | #f6ab79 | — |
| source.cpp meta.block variable.other | #91c1d8 | — |
| support.other.variable, string.other.link | #b480b0 | — |
| constant.numeric, support.constant, constant.character, constant.escape, keyword.other.unit, string, constant.language, 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, text.html.derivative | #cdd1ac | — |
| entity.other.inherited-class | #91c1d8 | — |
| meta.type.declaration | #91c1d8 | — |
| entity.name.type.alias | #91c1d8 | — |
| entity.name.type, support.type.primitive | #91c1d8 | italic |
| entity.name, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types | #968E88 | — |
| entity.name.module.js, variable.import.parameter.js, variable.other.class.js | #E1DEE3 | — |
| variable.language | #91c1d8 | italic |
| entity.name.method.js | #968E88 | italic |
| meta.class-method.js .js, variable.function.constructor | #968E88 | — |
| entity.other.attribute-name | #968E88CC | — |
| text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name | #f6ab79 | italic |
| source.sass keyword.control | #42675A | — |
| markup.inserted | #91c1d8 | — |
| markup.deleted | #506477 | — |
| markup.changed | #968E88 | — |
| string.regexp | #f6ab79 | — |
| constant.character.escape | #f6ab79 | — |
| *url*, *link*, *uri* | #91c1d8 | underline |
| tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js | #42675A | italic |
| source.js constant.other.object.key.js string.unquoted.label.js | #f6ab79 | italic |
| source.json meta.structure.dictionary.json support.type.property-name.json | #E1DEE3 | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #968E88 | — |
| 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 | #968E88 | — |
| 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 | #f6ab79 | — |
| 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 | #E1DEE3 | — |
| 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 | #91c1d8 | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #968E88 | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #f6ab79 | — |
| source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json | #E1DEE3 | — |
| text.html.markdown, punctuation.definition.list_item.markdown | #E1DEE3 | — |
| text.html.markdown markup.inline.raw.markdown | #91c1d8 | — |
| text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown | #968E88 | — |
| markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown | #E1DEE3 | — |
| markup.italic | #7390AA | italic |
| markup.bold, markup.bold string | #7390AA | bold |
| 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 | #7390AA | bold |
| markup.underline | #7390AA | underline |
| markup.strike | — | italic |
| markup.quote punctuation.definition.blockquote.markdown | #b480b0 | — |
| markup.quote | — | italic |
| string.other.link.title.markdown | #91c1d8 | — |
| string.other.link.description.title.markdown | #91c1d8 | — |
| constant.other.reference.link.markdown | #91c1d8 | — |
| markup.raw.block | #91c1d8 | — |
| markup.raw.block.fenced.markdown | #50647750 | — |
| punctuation.definition.fenced.markdown | #50647750 | — |
| markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end | #968E88 | — |
| variable.language.fenced.markdown | #968E88 | — |
| meta.separator | #7390AA | bold |
| markup.table | #91c1d8 | — |
| token.info-token | #91c1d8 | — |
| token.warn-token | #BEC0A4 | — |
| token.error-token | #FC8899 | — |
| token.debug-token | #E1DEE3 | — |
| entity.name.section.markdown, markup.heading.setext.1.markdown, markup.heading.setext.2.markdown | #E1DEE3 | bold |
| meta.paragraph.markdown | #E1DEE3d0 | — |
| punctuation.definition.from-file.diff, meta.diff.header.from-file | #506477 | — |
| punctuation.section.embedded | #968E88 | — |
| markup.inline.raw.string.markdown | #7390AA | — |
| meta.separator.markdown | #968E88 | — |
| markup.bold.markdown | — | bold |
| markup.italic.markdown | — | italic |
| beginning.punctuation.definition.list.markdown, punctuation.definition.list.begin.markdown, markup.list.unnumbered.markdown | #91c1d8 | — |
| string.other.link.description.title.markdown punctuation.definition.string.markdown, meta.link.inline.markdown string.other.link.description.title.markdown, string.other.link.description.title.markdown punctuation.definition.string.begin.markdown, string.other.link.description.title.markdown punctuation.definition.string.end.markdown, meta.image.inline.markdown string.other.link.description.title.markdown | #91c1d8 | |
| meta.link.inline.markdown string.other.link.title.markdown, meta.link.reference.markdown string.other.link.title.markdown, meta.link.reference.def.markdown markup.underline.link.markdown | #91c1d8 | underline |
| markup.underline.link.markdown, string.other.link.description.title.markdown | #b480b0 | — |
| fenced_code.block.language, markup.inline.raw.markdown | #91c1d8 | — |
| punctuation.definition.markdown, punctuation.definition.raw.markdown, punctuation.definition.heading.markdown, punctuation.definition.bold.markdown, punctuation.definition.italic.markdown | #91c1d8 | — |
| source.ignore, log.error, log.exception | #FC8899 | — |
| log.verbose | #968E88 | — |
| source.python constant.other | #cdd1ac | — |
| source.python constant | #cdd1ac | — |
| constant.character.format.placeholder.other.python storage | #b480b0 | — |
| support.variable.magic.python, source.python | #E1DEE3 | — |
| meta.function-call.generic.python | #BEC0A4 | — |
| support.type.python | #91c1d8 | — |
| meta.function.parameters.python | #b480b0 | — |
| punctuation.separator.annotation.python | #E1DEE3 | — |
| keyword.control.flow.python | #968E88 | — |
| punctuation.separator.parameters.python | #E1DEE3 | — |
| keyword.other.directive.using.cs, keyword.operator.expression.new.cs | #9ca989 | — |
| entity.name.variable.field.cs, entity.name.type.namespace.cs | #E1DEE3 | — |
| source.cs keyword.operator | #E1DEE3 | — |
| entity.name.function.cs | #b480b0 | — |
| variable.other.readwrite.cs | #E1DEE3 | — |
| variable.other.object.cs, entity.name.variable.local.cs, entity.name.variable.parameter.cs | #E1DEE3 | — |
| variable.other.object.property.cs | #E1DEE3 | — |
| entity.name.variable.property.cs | #E1DEE3 | — |
| keyword.operator.expression.await.cs | #b480b0 | italic |
| storage.type.cs | #E5C07B | — |
| keyword.other.unsafe.rust | #C678DD | — |
| entity.name.type.rust | #91c1d8 | — |
| storage.modifier.lifetime.rust | #E1DEE3 | — |
| entity.name.lifetime.rust, keyword.other.rust | #b480b0 | — |
| keyword.other.fn.rust | #968E88 | — |
| entity.name.function.macro.rust | #BEC0A4 | — |
| entity.name.namespace.rust | #E1DEE3 | — |
| storage.type.core.rust | #ff7546 | — |
| meta.attribute.rust | #b480b0 | — |
| storage.class.std.rust | #ff7546 | — |
| punctuation.separator.variable.ruby | #E1DEE3 | — |
| variable.other.constant.ruby | #b480b0 | — |
| keyword.other.special-method.ruby | #9ca989 | — |
| punctuation.definition.variable.php | #E1DEE3 | — |
| meta.class.php, entity.name.type.namespace.php | #E1DEE3 | — |
| keyword.other.namespace.php, keyword.other.use.php | #9ca989 | — |
| keyword.other.type.php | #91c1d8 | — |
| punctuation.definition.variable.php | #968E88 | — |
| support.class.builtin.php | #E1DEE3 | — |
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}!`;
}