A deep-sea theme for VS Code & Cursor. Eight variants — Trench, Midnight, Abyssal, Abyssal Deep, Steel, Oceanic, plus Surface and Abyssal Light. Abyssal blue backgrounds, teal currents, oceanic accents — language-agnostic.
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 |
|---|---|---|
| source, text | #c3cee3 | — |
| comment, punctuation.definition.comment | #546e7a | italic |
| keyword, keyword.control, keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as, keyword.control.default, keyword.control.module, keyword.control.flow, keyword.control.return, keyword.control.conditional, keyword.control.loop, keyword.control.trycatch, keyword.control.switch, keyword.other.new, keyword.other, keyword.other.package, keyword.other.import, storage.type, storage.type.ts, storage.type.tsx, storage.type.js, storage.type.java, storage.type.function.arrow, storage.type.type, storage.type.type.ts, storage.type.type.tsx, storage.type.interface, storage.type.interface.ts, storage.type.interface.tsx, storage.type.class, storage.type.enum, storage.modifier, storage.modifier.import, storage.modifier.package | #c792ea | — |
| entity.name.namespace, support.other.namespace, meta.import entity.name.namespace, meta.package.declaration entity.name.namespace, entity.name.module, meta.import string.quoted, variable.language.wildcard.java, storage.modifier.import.java, storage.modifier.package.java, meta.import.java, meta.package.java | #ffcb6b | — |
| meta.import variable.other.readwrite, meta.import variable.other.readwrite.alias, meta.import variable.other, meta.export variable.other.readwrite, meta.export variable.other | #ffcb6b | — |
| keyword.operator, keyword.operator.assignment, keyword.operator.comparison, keyword.operator.logical, keyword.operator.arithmetic, keyword.operator.type, keyword.operator.spread, keyword.operator.rest, keyword.operator.expression.typeof, keyword.operator.expression.instanceof, keyword.operator.expression.keyof | #89ddff | — |
| punctuation.definition.block, punctuation.definition.parameters, punctuation.definition.typeparameters, punctuation.definition.template-expression, punctuation.section.embedded, meta.brace.curly, meta.brace.round, meta.brace.square, punctuation.separator.comma, punctuation.terminator.statement, punctuation.accessor, punctuation.separator, punctuation.separator.key-value | #89ddff | — |
| variable, variable.other, variable.other.readwrite, variable.other.object, variable.other.constant, variable.other.readwrite.alias, variable.other.object.property, variable.other.property, variable.other.field | #eeffff | — |
| variable.parameter | #f78c6c | — |
| variable.language.this, variable.language.super | #ff5370 | — |
| string, string.quoted.single, string.quoted.double, string.quoted.backtick, string.template | #c3e88d | — |
| constant.character.escape | #89ddff | — |
| string.regexp | #c3e88d | — |
| constant.numeric | #f78c6c | — |
| constant.language, constant.language.boolean, constant.language.null, constant.language.undefined, constant.language.boolean.true, constant.language.boolean.false, constant.language.boolean.true.java, constant.language.boolean.false.java, constant.language.null.java | #c792ea | — |
| variable.other.enummember, constant.other.enum, meta.enum variable.other.readwrite | #eeffff | — |
| support.type.primitive, keyword.type, support.type.builtin, storage.type.primitive, storage.type.numeric.java, storage.type.boolean.java, storage.type.object.array.java | #c792ea | italic |
| meta.method entity.name.function, meta.definition.method entity.name.function, entity.name.function.member | #82aaff | — |
| meta.function-call.method entity.name.function, meta.method-call entity.name.function, variable.function.member, support.function.member | #82aaff | — |
| meta.function entity.name.function, meta.definition.function entity.name.function, entity.name.function | #82aaff | — |
| meta.function-call entity.name.function, meta.function-call.generic entity.name.function, support.function, support.function.builtin | #ffcb6b | — |
| support.function.hook, entity.name.function.hook, variable.other.constant.hook, meta.function-call entity.name.function.hook, support.function.react, entity.name.function.use | #ffcb6b | — |
| entity.name.class, entity.name.type.class, support.class, entity.other.inherited-class | #ffcb6b | — |
| new.expr entity.name.type, meta.new entity.name.type, meta.instance.constructor entity.name.type, support.class.builtin, support.class.error.ts, support.class.promise.ts, support.class.console.ts, support.class.error.tsx, support.class.promise.tsx, support.class.builtin.ts | #ffcb6b | — |
| meta.class.abstract entity.name.class, meta.class.abstract entity.name.type.class, entity.name.type.class.abstract, entity.name.class.abstract | #c3e88d | — |
| entity.name.type.interface | #c3e88d | — |
| entity.name.type.enum | #ffcb6b | — |
| entity.name.type, entity.name.type.alias, support.type | #c3e88d | — |
| entity.name.type.parameter | #c3e88d | — |
| entity.name.function.decorator, meta.decorator, punctuation.decorator, storage.type.annotation, entity.name.type.annotation, punctuation.definition.annotation, meta.declaration.annotation, support.type.annotation | #c792ea | — |
| constant.other.key.java, meta.declaration.annotation.java constant.other.key, meta.declaration.annotation constant.other.key, meta.declaration.annotation variable.other.readwrite, meta.declaration.annotation variable.other, meta.declaration.annotation variable.parameter, meta.annotation variable.other.readwrite, meta.annotation variable.other, meta.annotation variable.parameter, meta.annotation.identifier, meta.annotation.parameters variable.other.readwrite, meta.annotation.parameters variable.other, meta.annotation.java variable.other.readwrite, meta.annotation.java variable.other, annotation.identifier, annotation.parameter.name | #f78c6c | — |
| punctuation.definition.tag, punctuation.definition.tag.begin, punctuation.definition.tag.end | #89ddff | — |
| entity.name.tag, entity.name.tag.html, entity.name.tag.tsx, entity.name.tag.jsx, entity.name.tag.js, support.class.component, support.class.component.tsx, support.class.component.jsx | #f07178 | — |
| entity.other.attribute-name, entity.other.attribute-name.html, entity.other.attribute-name.tsx, entity.other.attribute-name.jsx | #ffcb6b | italic |
| entity.name.tag.css | #f07178 | — |
| entity.other.attribute-name.class.css | #ffcb6b | — |
| entity.other.attribute-name.id.css, entity.other.pseudo-class.css, entity.other.pseudo-element.css | #c792ea | — |
| support.type.property-name.css | #009688 | — |
| constant.numeric.css, keyword.other.unit.css, support.constant.property-value.css | #f78c6c | — |
| support.type.property-name.json | #c792ea | — |
| constant.language.json | #c792ea | — |
| keyword.other.DML.sql, keyword.other.DDL.sql, keyword.other.DCL.sql, keyword.other.alias.sql, keyword.other.create.sql, keyword.other.drop.sql, keyword.other.update.sql, keyword.other.delete.sql, keyword.other.insert.sql, keyword.other.select.sql, keyword.other.from.sql, keyword.other.where.sql, keyword.other.join.sql, keyword.other.order-by.sql, keyword.other.group-by.sql, keyword.other.having.sql, keyword.other.union.sql, keyword.other.limit.sql, keyword.other.sql | #c792ea | — |
| keyword.operator.logical.sql, keyword.operator.comparison.sql, keyword.operator.assignment.sql, keyword.operator.math.sql, keyword.operator.concatenator.sql, keyword.other.operator.sql | #89ddff | — |
| storage.type.sql, support.type.sql, support.type.builtin.sql | #c792ea | italic |
| support.function.aggregate.sql, support.function.scalar.sql, support.function.string.sql, support.function.numeric.sql, support.function.datetime.sql, support.function.window.sql, support.function.sql, meta.function-call.sql entity.name.function, entity.name.function.sql | #ffcb6b | — |
| string.quoted.single.sql, string.quoted.double.sql | #c3e88d | — |
| constant.numeric.sql | #f78c6c | — |
| entity.name.function.table.sql, entity.name.table.sql, constant.other.table-name.sql, constant.other.database-name.sql, meta.table-name.sql, entity.name.schema.sql | #ffcb6b | — |
| constant.other.column-name.sql, entity.name.column.sql, meta.column-name.sql, variable.other.column.sql | #eeffff | — |
| entity.name.alias.sql, variable.other.alias.sql | #c3e88d | — |
| string.quoted.other.identifier.sql, entity.name.identifier.sql | #ffcb6b | — |
| variable.parameter.sql, variable.other.bind.sql, constant.other.placeholder.sql | #f78c6c | — |
| punctuation.separator.comma.sql, punctuation.definition.parameters.sql, punctuation.section.scope.sql, punctuation.terminator.statement.sql | #89ddff | — |
| comment.line.double-dash.sql, comment.block.sql | #546e7a | italic |
| markup.heading, entity.name.section.markdown | #c3e88d | — |
| markup.bold | #f07178 | bold |
| markup.italic | #f07178 | italic |
| markup.inline.raw | #c792ea | — |
| markup.underline.link, string.other.link | #82aaff | — |
| invalid, invalid.illegal | #ff5370 |
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}!`;
}