MindEase Theme

Name: MindEase Theme
Author: yemreak

Publisher: yemreakThemes in package: 4

Crafted with Neurodesign, Built for You

Open in VS Code GitHub

Color themes

VS Code preview

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

MindEase Theme — 1. 🌑 Dark Mode: A Starry Night

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

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.

actionBar.toggledBackground#383a49
activityBar.activeBorder#0078D4
activityBar.background#181818
activityBar.border#2B2B2B
activityBar.foreground#D7D7D7
activityBar.inactiveForeground#868686
activityBarBadge.background#0078D4
activityBarBadge.foreground#FFFFFF
badge.background#616161
badge.foreground#F8F8F8
breadcrumb.foreground#808080
button.background#0078D4
button.border#FFFFFF12
button.foreground#FFFFFF
button.hoverBackground#026EC1
button.secondaryBackground#313131
button.secondaryForeground#CCCCCC
button.secondaryHoverBackground#3C3C3C
chat.slashCommandBackground#34414B
chat.slashCommandForeground#40A6FF
checkbox.background#313131
checkbox.border#3C3C3C
commandCenter.activeBackground#1e1e1e
commandCenter.activeForeground#dba827
commandCenter.background#1e1e1e
commandCenter.foreground#dba827dc
debugToolBar.background#181818
debugToolBar.border#2c2c2c
debugView.stateLabelBackground#432d11
descriptionForeground#9D9D9D
diffEditor.insertedLineBackground#353B27
diffEditor.insertedTextBackground#596F29
diffEditor.removedLineBackground#491616
diffEditor.removedTextBackground#491616
dropdown.background#313131
dropdown.border#3C3C3C
dropdown.foreground#CCCCCC
dropdown.listBackground#1F1F1F
editor.background#1F1F1F
editor.findMatchBackground#9E6A03
editor.findMatchHighlightBackground#500c00
editor.findRangeHighlightBackground#500c00
editor.foldBackground#2c2c2ce0
editor.foreground#CCCCCC
editor.hoverHighlightBackground#500c00
editor.inactiveSelectionBackground#3A3D41
editor.lineHighlightBorder#44444467
editor.selectionBackground#2e2e2e
editor.selectionHighlightBackground#ADD6FF26
editorCursor.foreground#9CDCFE
editorGroup.border#FFFFFF17
editorGroupHeader.tabsBackground#181818
editorGroupHeader.tabsBorder#2B2B2B
editorGutter.addedBackground#2EA043
editorGutter.deletedBackground#F85149
editorGutter.modifiedBackground#0078D4
editorHoverWidget.background#1e1e1e
editorHoverWidget.border#808080aa
editorHoverWidget.foreground#c1c1c1
editorIndentGuide.activeBackground1#707070
editorIndentGuide.background1#404040
editorLineNumber.activeForeground#CCCCCC
editorLineNumber.foreground#6E7681
editorOverviewRuler.border#010409
editorSuggestWidget.background#1e1e1e
editorSuggestWidget.border#80808054
editorSuggestWidget.focusHighlightForeground#c1c1c1
editorSuggestWidget.foreground#c1c1c1ae
editorSuggestWidget.highlightForeground#c1c1c1
editorWhitespace.foreground#2c2c2c
editorWidget.background#202020
errorForeground#F85149
focusBorder#0078D4
foreground#CCCCCC
gitDecoration.modifiedResourceForeground#dba827
icon.foreground#CCCCCC
input.background#313131
input.border#3C3C3C
input.foreground#CCCCCC
input.placeholderForeground#9D9D9D
inputOption.activeBackground#2489DB82
inputOption.activeBorder#2488DB
keybindingLabel.foreground#CCCCCC
list.activeSelectionBackground#2e2e2e
list.activeSelectionForeground#c1c1c1
list.activeSelectionIconForeground#FFF
list.dropBackground#383B3D
list.focusBackground#2c2c2ca2
list.focusForeground#c1c1c1
list.highlightForeground#dba827
list.hoverBackground#2e2e2e
list.inactiveSelectionBackground#2c2c2c
list.inactiveSelectionForeground#c1c1c1ee
menu.background#1F1F1F
menu.border#454545
menu.foreground#CCCCCC
menu.selectionBackground#2e2e2e
menu.selectionForeground#c1c1c1
menu.separatorBackground#454545
menubar.selectionBackground#c1c1c110
menubar.selectionForeground#c1c1c1
notificationCenter.border#808080
notificationCenterHeader.background#1F1F1F
notificationCenterHeader.foreground#CCCCCC
notifications.background#1F1F1F
notifications.border#2B2B2B
notifications.foreground#CCCCCC
notificationToast.border#80808050
panel.background#181818
panel.border#2B2B2B
panelInput.border#2B2B2B
panelSectionHeader.background#1E1E1E
panelTitle.activeBorder#0078D4
panelTitle.activeForeground#CCCCCC
panelTitle.inactiveForeground#9D9D9D
peekView.border#808080aa
peekViewEditor.background#1F1F1F
peekViewEditor.matchHighlightBackground#BB800966
peekViewEditorGutter.background#1e1e1e
peekViewResult.background#1F1F1F
peekViewResult.lineForeground#c1c1c1
peekViewResult.matchHighlightBackground#BB800966
peekViewTitle.background#1e1e1e
pickerGroup.border#3C3C3C
pickerGroup.foreground#dba827
ports.iconRunningProcessForeground#369432
progressBar.background#0078D4
quickInput.background#222222
quickInput.foreground#CCCCCC
quickInputList.focusBackground#2e2e2e
scrollbarSlider.activeBackground#444444
scrollbarSlider.background#44444467
scrollbarSlider.hoverBackground#444444
settings.dropdownBackground#313131
settings.dropdownBorder#3C3C3C
settings.headerForeground#FFFFFF
settings.modifiedItemIndicator#BB800966
settings.numberInputBackground#1e1e1e
settings.textInputBackground#1e1e1e
sideBar.background#181818
sideBar.border#2B2B2B
sideBar.foreground#CCCCCC
sideBarSectionHeader.background#181818
sideBarSectionHeader.border#2B2B2B
sideBarSectionHeader.foreground#CCCCCC
sideBarTitle.foreground#CCCCCC
statusBar.background#1E1E1E
statusBar.border#2B2B2B
statusBar.debuggingBackground#2c2c2c
statusBar.debuggingForeground#FFFFFF
statusBar.focusBorder#0078D4
statusBar.foreground#CCCCCC
statusBar.noFolderBackground#1F1F1F
statusBarItem.focusBorder#0078D4
statusBarItem.prominentBackground#6E768166
statusBarItem.remoteBackground#1E1E1E
statusBarItem.remoteForeground#FFFFFF
tab.activeBackground#1F1F1F
tab.activeBorder#1F1F1F
tab.activeBorderTop#0078D4
tab.activeForeground#FFFFFF
tab.border#2B2B2B
tab.hoverBackground#1F1F1F
tab.inactiveBackground#181818
tab.inactiveForeground#9D9D9D
tab.lastPinnedBorder#ccc3
tab.unfocusedActiveBorder#1F1F1F
tab.unfocusedActiveBorderTop#2B2B2B
tab.unfocusedHoverBackground#1F1F1F
terminal.ansiBlack#000000
terminal.ansiBlue#82aaff
terminal.ansiBrightBlack#546e7a
terminal.ansiBrightBlue#82aaff
terminal.ansiBrightCyan#89ddff
terminal.ansiBrightGreen#6de095
terminal.ansiBrightRed#e42b27
terminal.ansiBrightWhite#ffffff
terminal.ansiBrightYellow#f8c142
terminal.ansiCyan#89ddff
terminal.ansiGreen#73bc62
terminal.ansiRed#d82f2c
terminal.ansiWhite#ffffff
terminal.ansiYellow#e2a24c
terminal.background#1e1e1e
terminal.foreground#CCCCCC
terminal.inactiveSelectionBackground#3A3D41
terminal.selectionBackground#2e2e2e
terminal.tab.activeBorder#0078D4
terminalCursor.foreground#e4d9cc
textBlockQuote.background#2B2B2B
textBlockQuote.border#616161
textCodeBlock.background#2B2B2B
textLink.activeForeground#40A6FF
textLink.foreground#40A6FF
textSeparator.foreground#21262D
titleBar.activeBackground#181818
titleBar.activeForeground#CCCCCC
titleBar.border#2B2B2B
titleBar.inactiveBackground#1F1F1F
titleBar.inactiveForeground#9D9D9D
welcomePage.progress.foreground#0078D4
welcomePage.tileBackground#2B2B2B
widget.border#313131
widget.shadow#80808055

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
source	#c1c1c1	—
variable	#c1c1c1	italic
variable.parameter, source variable.parameter, meta.method.declaration, source.pip-requirements, meta.function-call.arguments, meta.attribute, meta.fstring	#b7b7b7	italic
markup.list.numbered.markdown	#c6c6c6	italic
meta.definition.method, meta.function.shell, entity.name.function	#F1BE34	—
meta.function-call, meta.statement.command.shell, meta.function-call.generic, support.class.promise	#f1be34	italic
variable.object.property, variable.other.property, variable.other.object.property, meta.object-literal.key	#adadad	—
support.variable.property, meta.type.parameters support.type	#adadad	italic bold
source keyword.operator, punctuation.separator, punctuation.section	#A3C3C7	—
punctuation.definition.decorator, support.function.builtin, support.function.magic, support.type.python, support.variable.magic, entity.name.function.decorator.python, keyword, string.regexp	#A3C3C7	italic
punctuation.accessor, keyword.operator.logical, meta.template.expression punctuation.definition, keyword.operator.new, entity.name.section, entity.name.tag, constant.language.python, support.type.property-name.json	#cb8800	—
variable.language, support.type.property-name, support.type.exception, variable.other.readwrite.alias	#cb8800	italic
keyword.control.trycatch	#cf7058	bold
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end	#cf705881	italic
constant.numeric, constant.language	#D19A66	—
meta.type.parameters, support.type.primitive.ts, support.type.builtin, entity.name.function.decorator, support.type	#E4BEDF	italic
entity.name.type	#C996A7	italic
entity.name.type.alias	#C996A7	—
entity.name.type.class, variable.other.constant.object	#eb9744	—
entity.other.inherited-class	#eb9744	italic
storage.type, keyword, keyword.control, storage.modifier, storage.type.property, keyword.operator.logical.python, keyword.operator.expression	#B180D7	—
string, string.unquoted.plain.out.yaml	#98C300	—
string.template	#98C300	italic
string.quoted.docstring.multi	#6a9500	—
comment, markup.quote, markup.raw.block.markdown	#6b7992	italic
log.warning	#F1BE34	italic bold
log.error	#d77158	italic bold
log.debug, keyword.codetag.notation	#6b7992	italic bold
log.info	#698ac9	italic bold
variable.other.constant, constant	#698ac9	italic
variable.other.enummember	#698ac9	—
markup.underline.link	#555555	—
source	#c1c1c1	—
variable	#c1c1c1	italic
variable.parameter, source variable.parameter, meta.method.declaration, source.pip-requirements, meta.function-call.arguments, meta.attribute, meta.fstring	#b7b7b7	italic
markup.list.numbered.markdown	#c6c6c6	italic
meta.definition.method, meta.function.shell, entity.name.function	#F1BE34	—
meta.function-call, meta.statement.command.shell, meta.function-call.generic, support.class.promise	#f1be34	italic
variable.object.property, variable.other.property, variable.other.object.property, meta.object-literal.key	#adadad	—
support.variable.property, meta.type.parameters support.type	#adadad	italic bold
source keyword.operator, punctuation.separator, punctuation.section	#A3C3C7	—
punctuation.definition.decorator, support.function.builtin, support.function.magic, support.type.python, support.variable.magic, entity.name.function.decorator.python, keyword, string.regexp	#A3C3C7	italic
punctuation.accessor, keyword.operator.logical, meta.template.expression punctuation.definition, keyword.operator.new, entity.name.section, entity.name.tag, constant.language.python, support.type.property-name.json	#cb8800	—
variable.language, support.type.property-name, support.type.exception, variable.other.readwrite.alias	#cb8800	italic
keyword.control.trycatch	#cf7058	bold
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end	#cf705881	italic
constant.numeric, constant.language	#D19A66	—
meta.type.parameters, support.type.primitive.ts, support.type.builtin, entity.name.function.decorator, support.type	#E4BEDF	italic
entity.name.type	#C996A7	italic
entity.name.type.alias	#C996A7	—
entity.name.type.class, variable.other.constant.object	#eb9744	—
entity.other.inherited-class	#eb9744	italic
storage.type, keyword, keyword.control, storage.modifier, storage.type.property, keyword.operator.logical.python, keyword.operator.expression	#B180D7	—
string, string.unquoted.plain.out.yaml	#98C300	—
string.template	#98C300	italic
string.quoted.docstring.multi	#6a9500	—
comment, markup.quote, markup.raw.block.markdown	#6b7992	italic
log.warning	#F1BE34	italic bold
log.error	#d77158	italic bold
log.debug, keyword.codetag.notation	#6b7992	italic bold
log.info	#698ac9	italic bold
variable.other.constant, constant	#698ac9	italic
variable.other.enummember	#698ac9	—
markup.underline.link	#555555	—
meta.embedded, source.groovy.embedded, string meta.image.inline.markdown, variable.legacy.builtin.python	#D4D4D4	—
emphasis	—	italic
strong	—	bold
header	#000080	—
comment	#6A9955	—
constant.language	#569cd6	—
constant.numeric, variable.other.enummember, keyword.operator.plus.exponent, keyword.operator.minus.exponent	#b5cea8	—
constant.regexp	#646695	—
entity.name.tag	#569cd6	—
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.scss	#d7ba7d	—
invalid	#f44747	—
markup.underline	—	underline
markup.bold	#569cd6	bold
markup.heading	#569cd6	bold
markup.italic	—	italic
markup.strikethrough	—	strikethrough
markup.inserted	#b5cea8	—
markup.deleted	#ce9178	—
markup.changed	#569cd6	—
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	—
meta.diff.header	#569cd6	—
storage	#569cd6	—
storage.type	#569cd6	—
storage.modifier, keyword.operator.noexcept	#569cd6	—
string, meta.embedded.assembly	#ce9178	—
string.tag	#ce9178	—
string.value	#ce9178	—
string.regexp	#d16969	—
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	#569cd6	—
keyword.control	#569cd6	—
keyword.operator	#d4d4d4	—
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	—
support.class, support.type, entity.name.type, entity.name.namespace, 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.directive.using, keyword.other.operator, entity.name.operator	#C586C0	—
variable, meta.definition.variable.name, support.variable, entity.name.variable, constant.other.placeholder	#9CDCFE	—
variable.other.constant, variable.other.enummember	#4FC1FF	—
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, constant.other.option	#569cd6	—
constant.character.escape	#d7ba7d	—
entity.name.label	#C8C8C8	—
meta.type.tuple, meta.item-access	#C996A7	italic
meta.array.literal	#C996A7	—
meta.import, meta.object-binding-pattern-variable, punctuation.definition.block	#B180D7	italic
meta.objectliteral	#CB8800	—
new.expr	#CB8800	italic
new.exprm	#CB8800	—
meta.arrow, meta.var.expr, meta.method.declaration, meta.embedded.line, meta.object.member, punctuation.definition.parameters, meta.function-call	#F1BE34	—

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