Skip to main content
Amund Theme | Coding Theme
Home Theme VS Code Amund Theme Visual Studio 2019 Dark with Amund's darker editor and UI surfaces.
VS Code preview Full workbench mockup using this variant's colors and tokenColors.
colors Workbench UI color keys from the theme JSON colors map.
activityBar.background #07090D activityBarBadge.background #007ACC dropdown.background #0A0D13 dropdown.listBackground #090B10 editor.background #1E1E1E editor.foreground #D4D4D4 tokenColors TextMate scopes and font styles (syntax highlighting rules).
scope foreground fontStyle meta.embedded, source.groovy.embedded #D4D4D4 — emphasis — italic strong — bold header #000080 — comment #6A9955 —
Shiki preview TypeScript sample highlighted with this variant's colors and tokenColors.
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}!`;
}
Amund Theme — Amund Theme
3
Open Editors fetchUser.ts index.ts README.md fetchUser.ts
index.ts
README.md
src main*
0 1
Copilot
Ln 5, Col 12
Spaces: 2
UTF-8
LF
TypeScript
Dark+
editor.inactiveSelectionBackground
#3A3D41
editor.selectionHighlightBackground #ADD6FF26
editorGroupHeader.tabsBackground #07090D
editorIndentGuide.activeBackground #707070
editorIndentGuide.background #404040
editorSuggestWidget.background #090B10
editorWidget.background #090B10
input.background #0A0D13
input.border #1C2330
input.placeholderForeground #A6A6A6
list.dropBackground #383B3D
menu.background #252526
menu.foreground #CCCCCC
panel.background #090B10
quickInput.background #090B10
quickInputList.focusBackground #121825
settings.numberInputBackground #292929
settings.textInputBackground #292929
sideBar.background #090B10
sideBarSectionHeader.background #0000
sideBarSectionHeader.border #ccc3
sideBarTitle.foreground #BBBBBB
statusBar.background #07090D
statusBarItem.remoteBackground #16825D
statusBarItem.remoteForeground #FFF
tab.inactiveBackground #090B10
tab.unfocusedInactiveBackground #090B10
titleBar.activeBackground #07090D constant.language #569cd6 —
constant.numeric, entity.name.operator.custom-literal.number, variable.other.enummember, keyword.operator.plus.exponent, keyword.operator.minus.exponent #b5cea8 —
entity.name.tag.css #d7ba7d —
entity.other.attribute-name #9cdcfe —
entity.other.attribute-name.class.css, entity.other.attribute-name.class.mixin.css, entity.other.attribute-name.id.css, entity.other.attribute-name.parent-selector.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, source.css.less entity.other.attribute-name.id, entity.other.attribute-name.attribute.scss, entity.other.attribute-name.scss #d7ba7d —
markup.underline — underline
markup.heading #569cd6 bold
punctuation.definition.quote.begin.markdown #6A9955 —
punctuation.definition.list.begin.markdown #6796e6 —
markup.inline.raw #ce9178 —
punctuation.definition.tag #808080 —
meta.preprocessor, entity.name.function.preprocessor #569cd6 —
meta.preprocessor.string #ce9178 —
meta.preprocessor.numeric #b5cea8 —
meta.structure.dictionary.key.python #9cdcfe —
storage.modifier, keyword.operator.noexcept #569cd6 —
string, entity.name.operator.custom-literal.string, meta.embedded.assembly #ce9178 —
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded #569cd6 —
meta.template.expression #d4d4d4 —
support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less, source.coffee.embedded #9cdcfe —
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.alignof, keyword.operator.typeid, keyword.operator.alignas, keyword.operator.instanceof, keyword.operator.logical.python, keyword.operator.wordlike #569cd6 —
keyword.other.unit #b5cea8 —
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php #569cd6 —
support.function.git-rebase #9cdcfe —
constant.sha.git-rebase #b5cea8 —
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java #d4d4d4 —
variable.language #569cd6 —
entity.name.function, support.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal #DCDCAA —
meta.return-type, support.class, support.type, entity.name.type, entity.other.attribute, entity.name.scope-resolution, entity.name.class, storage.type.numeric.go, storage.type.byte.go, storage.type.boolean.go, storage.type.string.go, storage.type.uintptr.go, storage.type.error.go, storage.type.rune.go, storage.type.cs, storage.type.generic.cs, storage.type.modifier.cs, storage.type.variable.cs, storage.type.annotation.java, storage.type.generic.java, storage.type.java, storage.type.object.array.java, storage.type.primitive.array.java, storage.type.primitive.java, storage.type.token.java, storage.type.groovy, storage.type.annotation.groovy, storage.type.parameters.groovy, storage.type.generic.groovy, storage.type.object.array.groovy, storage.type.primitive.array.groovy, storage.type.primitive.groovy #4EC9B0 —
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, entity.other.inherited-class #4EC9B0 —
keyword.control, source.cpp keyword.operator.new, keyword.operator.delete, keyword.other.using, keyword.other.operator, entity.name.operator #C586C0 —
variable, meta.definition.variable.name, support.variable, entity.name.variable #9CDCFE —
variable.other.constant, variable.other.enummember #51B6C4 —
meta.object-literal.key #9CDCFE —
support.constant.property-value, support.constant.font-name, support.constant.media-type, support.constant.media, constant.other.color.rgb-value, constant.other.rgb-value, support.constant.color #CE9178 —
punctuation.definition.group.regexp, punctuation.definition.group.assertion.regexp, punctuation.definition.character-class.regexp, punctuation.character.set.begin.regexp, punctuation.character.set.end.regexp, keyword.operator.negation.regexp, support.other.parenthesis.regexp #CE9178 —
constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp #d16969 —
keyword.operator.or.regexp, keyword.control.anchor.regexp #DCDCAA —
keyword.operator.quantifier.regexp #d7ba7d —
constant.character #569cd6 —
constant.character.escape #d7ba7d —
entity.name.label #C8C8C8 —
support.other.excluded #808080 —
keyword.preprocessor #808080 —
punctuation.definition.comment #6A9955 —
punctuation.definition.string #ce9178 —
entity.name.namespace, entity.name.type.namespace #D4D4D4 —
entity.name.variable.field #D4D4D4 —
variable.other.property #D4D4D4 —
variable.other.constant #D4D4D4 —
variable.other.enummember #D4D4D4 —
entity.name.type.interface #b8d7a3 —
entity.name.type.enum #b8d7a3 —
entity.name.type.type-parameter #b8d7a3 —
entity.name.type.struct #86C691 —
entity.name.function.extension #DCDCAA —
comment.documentation #608B4E —
comment.documentation.attribute #C8C8C8 —
comment.documentation.cdata #E9D585 —
comment.documentation.delimiter #808080 —
comment.documentation.name #569CD6 —
string.regexp.comment.cs #57A64A —
constant.character.character-class.regexp.cs #2EABFE —
keyword.control.anchor.regexp.cs #F979AE —
keyword.operator.quantifier.regexp.cs #F979AE —
string.regexp.self-escaped-character.cs #05C3BA —
keyword.operator.or.regexp.cs #05C3BA —
punctuation.definition.group.regexp.cs #D69D85 —
string.regexp.other-escape.cs #FFD68F —
fetchUser.ts Button.tsx Modal.tsx hooks utils index.ts public package.json tsconfig.json README.md Outline components
fetchUser.ts
fetchUser
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
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}!`;
}
Problems1
Output
Debug Console
Terminal
Ports
~/my-project $ pnpm dev
▲ Next.js ready on http://localhost:3000
✓ compiled client and server successfully in 412ms
wait - compiling /theme/vscode...
~/my-project $