《青蛇》主题|Green Snake Theme

Name: 《青蛇》主题|Green Snake Theme
Author: 张番茄-isiico

Publisher: 张番茄-isiicoThemes in package: 1

一场东方美学的代码奇遇|The Aesthetic Code Quest: When East Meets Binary

Open in VS Code GitHub

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

《青蛇》主题|Green Snake Theme — Green Snake Theme

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBorder#699543
activityBar.background#1D2C4C
activityBar.foreground#ffffffdc
activityBar.inactiveForeground#6a6d7c
activityBarBadge.background#CE6A88
badge.background#CE6A88
badge.foreground#f2f4fa
button.background#BCA734
button.foreground#ffffffdc
button.secondaryBackground#bbae84
button.secondaryForeground#ffffff
button.separator#ffffff83
chat.slashCommandBackground#29416F
chat.slashCommandForeground#a6aed3
descriptionForeground#8b8b8bce
dropdown.background#29416F
dropdown.border#3480BF
dropdown.foreground#ffffff
dropdown.listBackground#29416F
editor.background#1D2C4C
editor.findMatchBackground#f2dda8d2
editor.findMatchHighlightBackground#ecc0798c
editor.foreground#66849C
editor.lineHighlightBackground#ffffff22
editor.lineHighlightBorder#ffffff00
editor.selectionBackground#0262b08a
editor.selectionHighlightBackground#098f8b56
editor.wordHighlightBackground#098f8b7e
editorGroupHeader.tabsBackground#2B5CB6
editorGutter.background#629931af
editorLineNumber.activeForeground#eeeeee
editorLineNumber.foreground#cee0be9f
editorOverviewRuler.addedForeground#17c984
editorOverviewRuler.bracketMatchForeground#ffffff88
editorOverviewRuler.deletedForeground#eb2525
editorOverviewRuler.errorForeground#C7504D
editorOverviewRuler.findMatchForeground#c99130d2
editorOverviewRuler.infoForeground#5dbad1
editorOverviewRuler.modifiedForeground#ff8b2d
editorOverviewRuler.selectionHighlightForeground#ec605188
editorOverviewRuler.warningForeground#dd9b21
editorOverviewRuler.wordHighlightForeground#ec605188
editorOverviewRuler.wordHighlightStrongForeground#ec605188
editorSuggestWidget.background#29416F
editorSuggestWidget.border#29416F
editorWidget.background#29416F
editorWidget.border#29416F
errorForeground#D48D9D
focusBorder#699543
foreground#a6c1e4
icon.foreground#a6c1e4
input.background#1D2C4C
input.foreground#f2f4fa
input.placeholderForeground#3a5795
inputOption.activeBackground#2B5CB6
inputOption.activeBorder#4880e7
inputValidation.errorBackground#A84932
inputValidation.errorBorder#A84932
inputValidation.infoBackground#816696
inputValidation.infoBorder#816696
inputValidation.warningBackground#C99230
inputValidation.warningBorder#C99230
list.activeSelectionBackground#BCA734
list.activeSelectionForeground#f2f4fa
list.activeSelectionIconForeground#a6c1e4
list.deemphasizedForeground#ff0000
list.dropBackground#0282be25
list.errorForeground#f58381
list.filterMatchBackground#C5A9D5
list.focusAndSelectionOutline#BCA734
list.focusHighlightForeground#92ffbe
list.focusOutline#BCA734
list.highlightForeground#5bec95
list.hoverBackground#00000010
list.inactiveSelectionBackground#bca83444
list.inactiveSelectionIconForeground#a6c1e4
list.invalidItemForeground#ff0000
list.warningForeground#C99230
listFilterWidget.background#29416F
listFilterWidget.noMatchesOutline#fbff00
listFilterWidget.outline#ff0000
menubar.selectionBackground#29416F
menubar.selectionForeground#fffafa
minimap.background#27365a
minimap.errorHighlight#C7504D
minimap.findMatchHighlight#E0D1AA
minimap.foregroundOpacity#00000046
minimap.selectionHighlight#3480bfd5
minimap.selectionOccurrenceHighlight#05d1868c
minimap.warningHighlight#c99d6e
minimapGutter.addedBackground#17c984
minimapGutter.deletedBackground#9dff00
minimapGutter.modifiedBackground#ff8b2d
minimapSlider.activeBackground#2ca0ff7a
minimapSlider.background#3480bf7a
minimapSlider.hoverBackground#3480bfad
panel.background#1D2C4C
profileBadge.background#ff0000
profileBadge.foreground#ff0000
progressBar.background#3d99e4
sash.hoverBorder#C7504D
scrollbar.shadow#00000088
scrollbarSlider.activeBackground#798b53fa
scrollbarSlider.background#798b5373
scrollbarSlider.hoverBackground#798b53c0
selection.background#699543c2
settings.dropdownListBorder#ff0000
sideBar.background#eaedf1
sideBar.dropBackground#3480bf33
sideBar.foreground#66849C
sideBarSectionHeader.background#1D2C4C
sideBarSectionHeader.foreground#ffffffe5
sideBarTitle.foreground#00000067
statusBar.background#288D79
tab.activeBackground#1D2C4C
tab.border#2B5CB6
tab.hoverForeground#ffffff
tab.inactiveBackground#2B5CB6
tab.inactiveForeground#ffffffd2
tab.unfocusedActiveForeground#ffffffd2
tab.unfocusedInactiveForeground#ffffff75
textBlockQuote.background#29416F
textBlockQuote.border#3480BF
textCodeBlock.background#232530
textLink.activeForeground#89ddff
textLink.foreground#5fb5f3
textPreformat.foreground#ffea6b
textSeparator.foreground#707a84
titleBar.activeBackground#C7504D
titleBar.activeForeground#ffffff
titleBar.inactiveBackground#C7504D
titleBar.inactiveForeground#ffffffc0
toolbar.activeBackground#699543
toolbar.hoverBackground#9dc57a3d
toolbar.hoverOutline#9dc57a3d
tree.inactiveIndentGuidesStroke#b9b9b927
tree.indentGuidesStroke#a18f2746
tree.tableColumnsBorder#ffffff52
tree.tableOddRowsBackground#0f93eb57
widget.border#29416F
widget.shadow#2c2c2c8f

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
source keyword, source storage.type, source storage.modifier	#ba8ef7	—
source string, source string.quoted	#5bec95	—
source comment, source punctuation.definition.comment	#707a84	—
source entity.name.function, source support.function, source meta.function-call	#ffea6b	—
source entity.name.type, source support.class, source support.type, source entity.name.class	#5fb5f3	—
source constant.numeric	#89ddff	—
source keyword.operator, source punctuation.separator, source punctuation.terminator	#939da5	—
source variable, source variable.other, source variable.parameter	#a6c1e4	—
source, text, variable, constant, keyword	#a6c1e4	—
punctuation.separator, punctuation.terminator, punctuation.definition.string, punctuation.separator.key-value	#707a84	—
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter	#ff6a80	—
entity.other.attribute-name, entity.other.attribute-name.html	#ffa763	—
string.quoted.double.html, string.quoted.single.html	#5bec95	—
punctuation.definition.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html	#707a84	—
meta.tag.metadata.doctypedecl, meta.tag.metadata.doctype	#ba8ef7	—
markdown.heading, markup.heading, markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown	#5bec95	bold
markup.bold, markup.bold string	#ba8ef7	bold
markup.italic	#ba8ef7	italic
markup.raw, markup.inline.raw, markup.raw.block.markdown, markup.raw.block.fenced.markdown	#ffea6b	—
string.other.link.title.markdown	#5fb5f3	—
markup.underline.link, constant.other.reference.link.markdown	#89ddff	underline
markup.quote	#939da5	italic
punctuation.definition.list_item.markdown	#ffd700	—
meta.separator	#707a84	bold
punctuation.attribute-shorthand.event, punctuation.attribute-shorthand.bind, punctuation.attribute-shorthand.slot, entity.other.attribute-name.angular, punctuation.definition.keyword, variable.language.this	#ffffff	—
source.ts keyword.control, source.ts keyword.control.import, source.ts keyword.control.export, source.ts keyword.control.flow	#ba8ef7	—
source.ts storage.type, source.ts storage.modifier	#ba8ef7	—
source.ts entity.name.type, source.ts support.class, source.ts support.type, source.ts entity.name.class, source.ts meta.return.type, source.ts meta.type.annotation	#5fb5f3	—
source.ts variable.parameter	#ffa763	—
source.ts meta.decorator meta.array.literal variable.other.readwrite, source.ts meta.decorator meta.array.literal variable.other.object	#ffd700	—
source.ts variable.other.property, source.ts variable.object.property, source.ts meta.field.declaration variable.other.readwrite	#ffea6b	—
source.ts meta.object-literal.key, source.ts variable.other.property.ts	#939da5	—
source.ts variable.language.this	#939da5	—
source.ts meta.function-call entity.name.function, source.ts meta.method-call entity.name.function	#ba8ef7	—
source.ts meta.attribute.style.html source.css, source.ts meta.attribute.style.html source.css support.type.property-name.css, source.ts meta.attribute.style.html source.css meta.property-value.css, source.ts meta.attribute.style.html source.css constant.numeric.css, source.ts meta.attribute.style.html source.css keyword.other.unit.css, source.ts meta.attribute.style.html source.css punctuation.separator.key-value.css, source.ts meta.attribute.style.html source.css punctuation.terminator.rule.css	#5bec95	—
source.ts meta.attribute.style.html punctuation.definition.string.begin.html, source.ts meta.attribute.style.html punctuation.definition.string.end.html, source.ts meta.attribute.style.html punctuation.definition.string	#707a84	—

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}!`;
}