Vscode Nightfall Theme
Publisher: JUNGHOThemes in package: 1
A dark color theme based on GitHub Dark Dimmed, with web-aligned token colors, key/value color distinction, and yellow brackets inside strings
A dark color theme based on GitHub Dark Dimmed, with web-aligned token colors, key/value color distinction, and yellow brackets inside strings
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, string.comment | #768390 | — |
| constant.other.placeholder, constant.character | #f47067 | — |
| constant, entity.name.constant, variable.other.constant, variable.other.enummember, variable.language, entity | #6cb6ff | — |
| entity.name, meta.export.default, meta.definition.variable | #f69d50 | — |
| variable.parameter.function, meta.jsx.children, meta.block, meta.tag.attributes, entity.name.constant, meta.object.member, meta.embedded.expression | #adbac7 | — |
| entity.name.function | #dcbdfb | — |
| entity.name.tag, support.class.component | #8ddb8c | — |
| keyword | #f47067 | — |
| storage, storage.type | #f47067 | — |
| storage.modifier.package, storage.modifier.import, storage.type.java | #adbac7 | — |
| string, string punctuation.section.embedded source | #96d0ff | — |
| support | #6cb6ff | — |
| meta.property-name | #6cb6ff | — |
| variable | #f69d50 | — |
| variable.other | #adbac7 | — |
| invalid.broken | #ff938a | italic |
| invalid.deprecated | #ff938a | italic |
| invalid.illegal | #ff938a | italic |
| invalid.unimplemented | #ff938a | italic |
| carriage-return | #cdd9e5 | italic underline |
| message.error | #ff938a | — |
| string variable | #6cb6ff | — |
| source.regexp, string.regexp | #96d0ff | — |
| string.regexp.character-class, string.regexp constant.character.escape, string.regexp source.ruby.embedded, string.regexp string.regexp.arbitrary-repitition | #96d0ff | — |
| string.regexp constant.character.escape | #8ddb8c | bold |
| support.constant | #6cb6ff | — |
| support.variable | #6cb6ff | — |
| support.type.property-name.json | #8ddb8c | — |
| meta.module-reference | #6cb6ff | — |
| punctuation.definition.list.begin.markdown | #f69d50 | — |
| markup.heading, markup.heading entity.name | #6cb6ff | bold |
| markup.quote | #8ddb8c | — |
| markup.italic | #adbac7 | italic |
| markup.bold | #adbac7 | bold |
| markup.underline | — | underline |
| markup.strikethrough | — | strikethrough |
| markup.inline.raw | #6cb6ff | — |
| markup.deleted, meta.diff.header.from-file, punctuation.definition.deleted | #ff938a | — |
| punctuation.section.embedded | #f47067 | — |
| markup.inserted, meta.diff.header.to-file, punctuation.definition.inserted | #8ddb8c | — |
| markup.changed, punctuation.definition.changed | #f69d50 | — |
| markup.ignored, markup.untracked | #2d333b | — |
| meta.diff.range | #dcbdfb | bold |
| meta.diff.header | #6cb6ff | — |
| meta.separator | #6cb6ff | bold |
| meta.output | #6cb6ff | — |
| brackethighlighter.tag, brackethighlighter.curly, brackethighlighter.round, brackethighlighter.square, brackethighlighter.angle, brackethighlighter.quote | #768390 | — |
| brackethighlighter.unmatched | #ff938a | — |
| constant.other.reference.link, string.other.link | #96d0ff | — |
| comment, punctuation.definition.comment, string.comment | #7CA964 | — |
| variable, variable.other.readwrite, variable.other.object, variable.other.definition, variable.parameter, entity.name.variable, meta.definition.variable, meta.definition.variable variable.other.constant | #D1D7E0 | — |
| variable.other.property, variable.other.object.property, variable.other.constant.property, variable.property, support.variable.property | #6CB6FF | — |
| variable.other.constant, variable.other.constant.object, variable.other.enummember | #6CB6FF | — |
| keyword.operator.assignment, keyword.operator.assignment.compound, keyword.operator.comparison, keyword.operator.relational, keyword.operator.logical, keyword.operator.arithmetic, keyword.operator.bitwise, keyword.operator.increment, keyword.operator.decrement, keyword.operator.ternary, keyword.operator.arrow, storage.type.function.arrow, meta.arrow.ts storage.type.function.arrow, meta.arrow storage.type.function.arrow | #6CB6FF | — |
| constant.numeric, constant.numeric.decimal, constant.numeric.hex, constant.numeric.integer, constant.numeric.float | #63EC63 | — |
| keyword.operator.spread, keyword.operator.rest, keyword.operator.type.annotation, keyword.operator.optional | #D1D7E0 | — |
| support.class.builtin, support.class.promise, support.class.error, new.expr entity.name.function | #F69D50 | — |
| punctuation.definition.comment | #7CA964 | — |
| text.html entity.name.tag, text.html entity.name.tag.html, text.html meta.tag.metadata.doctype entity.name.tag | #F47067 | — |
| text.html entity.other.attribute-name, text.html entity.other.attribute-name.html, text.html entity.other.attribute-name.id.html, text.html entity.other.attribute-name.class.html | #F69D50 | — |
| text.html meta.tag.metadata.doctype entity.other.attribute-name | #D1D7E0 | — |
| text.html string.quoted.double.html, text.html string.quoted.single.html, text.html string.unquoted.html, text.html string.quoted.double.html punctuation.definition.string, text.html string.quoted.single.html punctuation.definition.string | #D1D7E0 | — |
| text.html source.css entity.name.tag | #F69D50 | — |
| text.html punctuation.separator.key-value.html, text.html punctuation.definition.tag | #D1D7E0 | — |
| text.html source.css support.type.property-name, text.html source.css meta.property-name, text.html source.css support.type.vendored.property-name, text.html meta.attribute.style support.type.property-name | #6CB6FF | — |
| text.html source.css support.constant.property-value, text.html source.css support.constant.font-name, text.html source.css support.constant.color, text.html meta.attribute.style support.constant.property-value | #D1D7E0 | — |
| text.html source.css entity.other.attribute-name.class, text.html source.css entity.other.attribute-name.id, text.html source.css entity.other.attribute-name.pseudo-class, text.html source.css entity.other.attribute-name.pseudo-element | #F69D50 | — |
| text.html source.css support.function | #CBA6F7 | — |
| source.js entity.name.function, source.jsx entity.name.function, source.js.jsx entity.name.function, source.ts entity.name.function, source.tsx entity.name.function, source.js meta.function-call entity.name.function, source.ts meta.function-call entity.name.function, source.tsx meta.function-call entity.name.function, source.js entity.name.function.member, source.ts entity.name.function.member, source.tsx entity.name.function.member, source.js meta.method.declaration entity.name.function, source.ts meta.method.declaration entity.name.function, source.tsx meta.method.declaration entity.name.function, source.js support.function, source.ts support.function, source.tsx support.function, source.js variable.function, source.ts variable.function, source.tsx variable.function | #CBA6F7 | — |
| source.js entity.name.type, source.ts entity.name.type, source.tsx entity.name.type, source.js entity.name.class, source.ts entity.name.class, source.tsx entity.name.class, source.ts entity.name.type.class, source.tsx entity.name.type.class, source.ts entity.name.type.interface, source.tsx entity.name.type.interface, source.ts entity.name.type.enum, source.tsx entity.name.type.enum, source.ts entity.name.type.alias, source.tsx entity.name.type.alias, source.ts entity.name.type.module, source.js entity.other.inherited-class, source.ts entity.other.inherited-class, source.tsx entity.other.inherited-class, source.js support.class, source.ts support.class, source.tsx support.class | #F69D50 | — |
| source.js keyword.control, source.ts keyword.control, source.tsx keyword.control, source.js storage.type, source.ts storage.type, source.tsx storage.type, source.js storage.modifier, source.ts storage.modifier, source.tsx storage.modifier, source.js keyword.operator.new, source.ts keyword.operator.new, source.tsx keyword.operator.new, source.js keyword.operator.expression, source.ts keyword.operator.expression, source.tsx keyword.operator.expression | #F47067 | — |
| source.js.jsx entity.name.tag, source.jsx entity.name.tag, source.tsx entity.name.tag, source.js entity.name.tag.js.jsx, source.tsx entity.name.tag.tsx | #F47067 | — |
| source.js.jsx entity.other.attribute-name, source.jsx entity.other.attribute-name, source.tsx entity.other.attribute-name, source.js entity.other.attribute-name.jsx | #F69D50 | — |
| source.js string.quoted, source.jsx string.quoted, source.js.jsx string.quoted, source.ts string.quoted, source.tsx string.quoted, source.js string.template, source.jsx string.template, source.js.jsx string.template, source.ts string.template, source.tsx string.template, source.js string.quoted punctuation.definition.string, source.ts string.quoted punctuation.definition.string, source.tsx string.quoted punctuation.definition.string, source.jsx string.quoted punctuation.definition.string, source.js string.template punctuation.definition.string, source.ts string.template punctuation.definition.string, source.tsx string.template punctuation.definition.string | #D1D7E0 | — |
| source.json string.quoted.double, source.json string.quoted.double punctuation.definition.string, source.json meta.structure.dictionary.value string.quoted.double | #D1D7E0 | — |
| source.css entity.name.tag, source.css entity.other.attribute-name.class, source.css entity.other.attribute-name.id, source.css entity.other.attribute-name.pseudo-class, source.css entity.other.attribute-name.pseudo-element, source.css entity.other.attribute-name.parent-selector | #F69D50 | — |
| source.css support.type.property-name, source.css meta.property-name, source.css support.type.vendored.property-name | #6CB6FF | — |
| source.css support.constant.property-value, source.css support.constant.vendored.property-value, source.css support.constant.font-name, source.css support.constant.color, source.css constant.other.color, source.css keyword.other.unit | #D1D7E0 | — |
| source.css support.function, source.css meta.function | #CBA6F7 | — |
| source.css string.quoted.single, source.css string.quoted.double, source.css string.quoted.single punctuation.definition.string, source.css string.quoted.double punctuation.definition.string | #D1D7E0 | — |
| source.css keyword.control.at-rule, source.css punctuation.definition.keyword | #F47067 | — |
| source.css variable, source.css variable.scss, source.css variable.other.less | #D1D7E0 | — |
| entity.name.function, meta.function-call entity.name.function, entity.name.function.member, entity.name.function.call, support.function, variable.function | #CBA6F7 | — |
| entity.name.type, entity.name.class, entity.other.inherited-class, support.class, entity.name.type.class, entity.name.type.interface, entity.name.type.enum, entity.name.type.struct, entity.name.namespace, storage.type.class, storage.type.struct, storage.type.enum, storage.type.interface | #F69D50 | — |
| storage.type.java | #F69D50 | — |
| keyword.control, keyword.other, storage.type, storage.modifier, keyword.operator.new, keyword.operator.expression, keyword.operator.wordlike, variable.language | #F47067 | — |
| entity.name.tag | #F47067 | — |
| entity.other.attribute-name | #F69D50 | — |
| string.quoted, string.interpolated, string.unquoted, string.quoted punctuation.definition.string | #D1D7E0 | — |
| string.template, string.quoted.other.template, string.template punctuation.definition.string, punctuation.definition.string.template, source.js string.template, source.jsx string.template, source.js.jsx string.template, source.ts string.template, source.tsx string.template, source.js string.template punctuation.definition.string, source.ts string.template punctuation.definition.string, source.tsx string.template punctuation.definition.string | #F4D4AE | — |
| source.json support.type.property-name, source.json support.type.property-name punctuation.definition.string, source.json meta.structure.dictionary.key string.quoted.double | #6CB6FF | — |
| source.js meta.object-literal.key, source.jsx meta.object-literal.key, source.js.jsx meta.object-literal.key, source.ts meta.object-literal.key, source.tsx meta.object-literal.key, source.js meta.object-literal.key string.quoted.double, source.ts meta.object-literal.key string.quoted.double, source.tsx meta.object-literal.key string.quoted.double, source.js meta.object-literal.key string.quoted.single, source.ts meta.object-literal.key string.quoted.single, meta.object-literal.key | #6CB6FF | — |
| string.quoted.single.nested.in-string, string.quoted.double.nested.in-string | #F4D4AE | — |
| punctuation.bracket.in-string | #F2CC60 | — |
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}!`;
}