Mint Breeze Theme

Name: Mint Breeze Theme
Author: lilin

Publisher: lilinThemes in package: 2

A fresh, soft and premium mint-green color theme for VS Code with light and dark modes for calm, focused creative coding.

Open in VS Code GitHub

Color themes

VS Code preview

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

Mint Breeze Theme — Mint Breeze Dark

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

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 $

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#75D8C4
activityBar.background#121C1B
activityBar.foreground#8FE6D2
activityBar.inactiveForeground#6E918B
activityBarBadge.background#75D8C4
activityBarBadge.foreground#0E1817
badge.background#75D8C4
badge.foreground#0E1817
breadcrumb.activeSelectionForeground#8FE6D2
breadcrumb.background#172523
breadcrumb.focusForeground#8FE6D2
breadcrumb.foreground#6E918B
breadcrumbPicker.background#121C1B
button.background#75D8C4
button.foreground#0E1817
button.hoverBackground#8FE6D2
button.secondaryBackground#263B37
button.secondaryForeground#8FE6D2
button.secondaryHoverBackground#385650
contrastBorder#385650
debugIcon.breakpointForeground#E08A6A
debugIcon.exceptionBreakpointForeground#F0B58A
debugToolBar.background#1E302D
descriptionForeground#6E918B
dropdown.background#121C1B
dropdown.border#385650
dropdown.foreground#D8E8E3
editor.background#172523
editor.findMatchBackground#4A7A71
editor.findMatchHighlightBackground#3E6F67
editor.foreground#D8E8E3
editor.inactiveSelectionBackground#2E534D
editor.lineHighlightBackground#1E302D
editor.lineHighlightBorder#00000000
editor.selectionBackground#3E6F67
editor.selectionHighlightBackground#2E534D
editorBracketMatch.background#75D8C459
editorBracketMatch.border#75D8C4
editorCursor.foreground#8FE6D2
editorError.foreground#E08A6A
editorGroup.border#263B37
editorGroupHeader.tabsBackground#1E302D
editorGroupHeader.tabsBorder#263B37
editorGutter.background#172523
editorHint.foreground#6E918B
editorHoverWidget.background#1E302D
editorHoverWidget.border#385650
editorIndentGuide.activeBackground#3E6F67
editorIndentGuide.background#263B37
editorInfo.foreground#7FB6D6
editorLineNumber.activeForeground#A5F0DE
editorLineNumber.foreground#4A6560
editorOverviewRuler.border#263B37
editorSuggestWidget.background#1E302D
editorSuggestWidget.border#385650
editorSuggestWidget.selectedBackground#263B37
editorWarning.foreground#F0B58A
editorWhitespace.foreground#2E4944
editorWidget.background#1E302D
editorWidget.border#385650
focusBorder#75D8C4
gitDecoration.addedResourceForeground#8FD8C8
gitDecoration.conflictingResourceForeground#F0B58A
gitDecoration.deletedResourceForeground#E08A6A
gitDecoration.ignoredResourceForeground#6E918B
gitDecoration.modifiedResourceForeground#F0B58A
gitDecoration.stageDeletedResourceForeground#E08A6A
gitDecoration.stageModifiedResourceForeground#75D8C4
gitDecoration.untrackedResourceForeground#8FD8C8
input.background#121C1B
input.border#385650
input.foreground#D8E8E3
input.placeholderForeground#6E918B
inputOption.activeBorder#75D8C4
inputValidation.errorBackground#3A2420
inputValidation.errorBorder#E08A6A
inputValidation.infoBackground#263B37
inputValidation.infoBorder#75D8C4
inputValidation.warningBackground#3A2F22
inputValidation.warningBorder#F0B58A
list.activeSelectionBackground#3E6F67
list.activeSelectionForeground#EAF6F2
list.errorForeground#E08A6A
list.focusBackground#263B37
list.highlightForeground#8FE6D2
list.hoverBackground#263B37
list.inactiveSelectionBackground#2E534D
list.inactiveSelectionForeground#EAF6F2
list.warningForeground#F0B58A
listFilterWidget.background#121C1B
listFilterWidget.border#385650
listFilterWidget.shadow#00000066
menu.background#1E302D
menu.border#385650
menu.foreground#D8E8E3
menu.selectionBackground#3E6F67
menu.selectionForeground#EAF6F2
menu.separatorBackground#385650
minimap.findMatchHighlight#75D8C4
minimap.selectionHighlight#3E6F67
minimapGutter.addedBackground#8FD8C8
minimapGutter.deletedBackground#E08A6A
minimapGutter.modifiedBackground#F0B58A
notification.background#1E302D
notification.border#385650
notification.foreground#D8E8E3
notificationCenter.border#385650
notificationCenterHeader.background#1E302D
notifications.foreground#D8E8E3
panel.background#1E302D
panel.border#263B37
panelTitle.activeForeground#8FE6D2
panelTitle.inactiveForeground#6E918B
peekView.border#75D8C4
peekViewEditor.background#172523
peekViewEditorGutter.background#172523
peekViewResult.background#1E302D
peekViewResult.matchHighlightBackground#3E6F67
peekViewTitle.background#263B37
peekViewTitleLabel.foreground#8FE6D2
progressBar.background#75D8C4
scrollbarSlider.activeBackground#75D8C4BF
scrollbarSlider.background#75D8C44D
scrollbarSlider.hoverBackground#75D8C48C
sideBar.background#1E302D
sideBar.foreground#D8E8E3
sideBarSectionHeader.background#263B37
sideBarSectionHeader.foreground#8FE6D2
sideBarTitle.foreground#8FE6D2
statusBar.background#75D8C4
statusBar.debuggingBackground#3E6F67
statusBar.foreground#0E1817
statusBar.noFolderBackground#4A7A71
statusBarItem.hoverBackground#8FE6D2
statusBarItem.remoteBackground#3E6F67
statusBarItem.remoteForeground#0E1817
tab.activeBackground#172523
tab.activeBorder#75D8C4
tab.activeForeground#D8E8E3
tab.border#263B37
tab.inactiveBackground#1E302D
tab.inactiveForeground#6E918B
tab.unfocusedActiveBackground#172523
tab.unfocusedActiveBorder#75D8C4
tab.unfocusedActiveForeground#D8E8E3
tab.unfocusedInactiveForeground#6E918B
terminal.ansiBlack#121C1B
terminal.ansiBlue#7FB6D6
terminal.ansiBrightBlack#6E918B
terminal.ansiBrightBlue#A5D2E8
terminal.ansiBrightCyan#8FE6D2
terminal.ansiBrightGreen#A5F0DE
terminal.ansiBrightMagenta#DDB6E2
terminal.ansiBrightRed#EBA98E
terminal.ansiBrightWhite#FFFFFF
terminal.ansiBrightYellow#F5C79E
terminal.ansiCyan#75D8C4
terminal.ansiGreen#8FD8C8
terminal.ansiMagenta#C99AD0
terminal.ansiRed#E08A6A
terminal.ansiWhite#D8E8E3
terminal.ansiYellow#F0B58A
terminal.background#121C1B
terminal.foreground#D8E8E3
terminal.selectionBackground#3E6F67
terminalCursor.foreground#8FE6D2
textCodeBlock.background#263B37
textLink.activeForeground#D8E8E3
textLink.foreground#8FE6D2
textPreformat.foreground#8FE6D2
textSeparator.foreground#6E918B
titleBar.activeBackground#121C1B
titleBar.activeForeground#D8E8E3
titleBar.border#263B37
titleBar.inactiveBackground#1E302D
titleBar.inactiveForeground#6E918B
toolbar.activeBackground#2E534D
toolbar.hoverBackground#263B37
watermark.color#4A6560
widget.shadow#00000073

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment	#7F9A94	italic
comment.line	#7F9A94	italic
comment.block	#7F9A94	italic
string	#A8D6A0	—
string.quoted	#A8D6A0	—
string.template	#A8D6A0	—
string.regexp	#A8D6A0	—
constant.numeric	#F0B58A	—
constant.language	#F0B58A	—
constant.character	#F0B58A	—
constant.character.escape	#F0B58A	—
constant.other	#F0B58A	—
keyword	#8FE6D2	—
keyword.control	#8FE6D2	—
keyword.operator	#8FE6D2	—
keyword.operator.new	#8FE6D2	—
storage.type	#8FE6D2	—
storage.modifier	#8FE6D2	—
variable.language	#8FE6D2	—
entity.name.function	#A5F0DE	—
support.function	#A5F0DE	—
meta.function-call	#A5F0DE	—
meta.function-call.method	#A5F0DE	—
variable.function	#A5F0DE	—
entity.name.type	#A5F0DE	—
entity.name.class	#A5F0DE	—
entity.name.namespace	#A5F0DE	—
support.type	#A5F0DE	—
support.class	#A5F0DE	—
entity.other.attribute-name	#A5F0DE	—
entity.name.tag	#8FE6D2	—
punctuation.definition.tag	#6E918B	—
meta.attribute	#F0B58A	—
variable	#D8E8E3	—
variable.parameter	#D8E8E3	—
variable.other.property	#D8E8E3	—
meta.object-literal.key	#8FE6D2	—
support.type.property-name	#8FE6D2	—
string.key.json	#8FE6D2	—
support.constant	#F0B58A	—
markup.heading	#8FE6D2	bold
markup.bold	#D8E8E3	bold
markup.italic	#D8E8E3	italic
markup.code	#A5F0DE	—
markup.inline.raw	#A5F0DE	—
markup.link	#75D8C4	—
string.other.link	#75D8C4	—
punctuation.definition.link	#75D8C4	—
meta.decorator	#F0B58A	—
annotation	#F0B58A	—
invalid	#E08A6A	—
invalid.deprecated	#E08A6A	—