Soil Theme

Name: Soil Theme
Author: Codesbiome

Publisher: CodesbiomeThemes in package: 2

A relaxing theme for Visual Studio Code to put crazy ideas into existence

Open in VS Code GitHub

Color themes

VS Code preview

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

Soil Theme — Soil Theme

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.activeBackground#3f312891
activityBar.activeBorder#b35118d8
activityBar.background#1c1c1c
activityBar.dropBorder#b35118d8
activityBar.foreground#aca490
activityBar.inactiveForeground#aca4906e
activityBarBadge.background#b35118d8
activityBarBadge.foreground#ffdeb4
badge.background#b35118d8
badge.foreground#ffffffbe
breadcrumb.background#2e2e2e
button.background#b35118d8
button.foreground#ffffffe3
dropdown.background#181818
dropdown.border#333333
dropdown.foreground#aca490
dropdown.listBackground#181818
editor.background#222222
editor.foreground#aca490
editor.inactiveSelectionBackground#b3511848
editor.lineHighlightBackground#2c2c2c
editor.selectionBackground#b3511860
editor.selectionHighlightBackground#8f503d46
editor.wordHighlightBackground#3c38369f
editorBracketMatch.background#363636
editorBracketMatch.border#423f3b
editorCursor.foreground#ffb300da
editorError.foreground#cf7c7c
editorGroup.dropBackground#3c38369f
editorGroupHeader.border#2e2e2e
editorGroupHeader.tabsBackground#1e1e1e
editorGutter.background#222222
editorHint.foreground#9c9c9c
editorIndentGuide.activeBackground#423f3b
editorIndentGuide.background#2e2d2d
editorLineNumber.activeForeground#de7e50
editorLineNumber.foreground#928a83a2
editorLink.activeForeground#3a9c93
editorOverviewRuler.errorForeground#8a4848
editorSuggestWidget.background#1c1c1c
editorSuggestWidget.border#2e2e2e
editorSuggestWidget.foreground#aca490
editorSuggestWidget.highlightForeground#c58961
editorSuggestWidget.selectedBackground#3f312891
focusBorder#2e2e2e00
foreground#aca490d3
gitDecoration.addedResourceForeground#3a9c93
gitDecoration.conflictingResourceForeground#df6a9bf1
gitDecoration.deletedResourceForeground#e26a6ae1
gitDecoration.ignoredResourceForeground#aca4907a
gitDecoration.modifiedResourceForeground#c1a960df
gitDecoration.submoduleResourceForeground#699bdb
gitDecoration.untrackedResourceForeground#6ec07cde
input.background#181818
input.foreground#aca490
input.placeholderForeground#b8b8b89b
list.activeSelectionBackground#3f312891
list.activeSelectionForeground#aca490
list.errorForeground#cf7c7c
list.focusBackground#b35118d8
list.focusForeground#cfcfcf
list.highlightForeground#de7e50
list.hoverBackground#2e2e2ec4
list.inactiveFocusBackground#3f312891
list.inactiveSelectionBackground#3f312891
list.inactiveSelectionForeground#aca490
list.warningForeground#d39a69
menu.background#181818
menu.border#2e2e2e
menu.foreground#d3cac1a8
menu.selectionBackground#3f312891
menu.selectionForeground#aca490
menu.separatorBackground#333333
minimap.errorHighlight#8a4848
minimap.selectionHighlight#8f503d71
minimapSlider.activeBackground#7540257e
minimapSlider.background#5d3c2b5d
minimapSlider.hoverBackground#5f3a287e
panel.dropBorder#b35118d8
panelTitle.activeBorder#b35118d8
panelTitle.activeForeground#aca490
peekView.border#b35118d8
peekViewEditor.background#33312e
peekViewEditor.matchHighlightBackground#8f503d46
peekViewResult.background#1c1c1c
peekViewResult.fileForeground#a3a3a3
peekViewResult.lineForeground#a3a3a3
peekViewResult.selectionBackground#3f312891
peekViewResult.selectionForeground#aca490
peekViewTitleDescription.foreground#de7e50
peekViewTitleLabel.foreground#aca490
pickerGroup.foreground#de7e50
problemsErrorIcon.foreground#cf7c7c
problemsWarningIcon.foreground#d39a69
quickInputList.focusBackground#b35118d8
scrollbar.shadow#111111b2
scrollbarSlider.activeBackground#b351188c
scrollbarSlider.background#6d46335d
scrollbarSlider.hoverBackground#6d442c8c
selection.background#af4f17a1
settings.checkboxBackground#181818
settings.checkboxBorder#2e2e2e
settings.checkboxForeground#ff7c30d8
settings.dropdownBackground#181818
settings.dropdownBorder#2e2e2e
settings.dropdownForeground#aca490
settings.dropdownListBorder#333333
settings.headerForeground#b4926ce7
settings.modifiedItemIndicator#b35118d8
sideBar.background#202020
sideBar.border#2e2e2e
sideBar.foreground#979797
sideBarSectionHeader.background#1c1c1c
sideBarSectionHeader.border#202020
sideBarSectionHeader.foreground#b4926ce7
sideBarTitle.foreground#b4926ce7
statusBar.background#1e1e1e
statusBar.debuggingBackground#b32f18d8
statusBar.debuggingForeground#ccb6b6ef
statusBar.foreground#bbb8b896
statusBar.noFolderBackground#1e1e1e
statusBarItem.activeBackground#353535
statusBarItem.hoverBackground#2e2e2e
symbolIcon.arrayForeground#9c9c9c
symbolIcon.booleanForeground#cf7c7c
symbolIcon.classForeground#59ae8b
symbolIcon.constantForeground#cf7c7c
symbolIcon.constructorForeground#d39a69
symbolIcon.fieldForeground#92b4b1
symbolIcon.functionForeground#c1a860
symbolIcon.interfaceForeground#3a9c93
symbolIcon.methodForeground#c1a860
symbolIcon.moduleForeground#9c9c9c
symbolIcon.namespaceForeground#d39a69
symbolIcon.numberForeground#cf7c7c
symbolIcon.objectForeground#cf7c9f
symbolIcon.propertyForeground#92b4b1
symbolIcon.stringForeground#53ab62
symbolIcon.variableForeground#92b4b1
tab.activeBackground#2e2e2e
tab.activeForeground#b6b5b4
tab.activeModifiedBorder#b47125a4
tab.hoverForeground#b6b5b4
tab.inactiveBackground#1e1e1e
tab.inactiveForeground#bbb8b896
terminal.ansiBlack#3a3a3a
terminal.ansiBlue#4975af
terminal.ansiBrightBlack#838383
terminal.ansiBrightBlue#699bdb
terminal.ansiBrightCyan#7ab8b2
terminal.ansiBrightGreen#6ec07b
terminal.ansiBrightMagenta#df6a9a
terminal.ansiBrightRed#e26a6a
terminal.ansiBrightWhite#c0b699
terminal.ansiBrightYellow#d39a69
terminal.ansiCyan#3a9c93
terminal.ansiGreen#53ab62
terminal.ansiMagenta#bd688b
terminal.ansiRed#cf7c7c
terminal.ansiWhite#bebebe
terminal.ansiYellow#c1a860
terminal.foreground#aca490
terminal.selectionBackground#6d65616c
terminalCursor.foreground#ffb300da
textLink.activeForeground#df793ed8
textLink.foreground#d3723bd8
textPreformat.foreground#cf7c7c
titleBar.activeBackground#181818
titleBar.activeForeground#d3cac1a8
titleBar.inactiveBackground#181818
titleBar.inactiveForeground#d3cac1a8
widget.shadow#111111b2

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
keyword.operator.logical.soil	#CF7C7C	—
function.parameter.type.soil	#CF7C9F	—
comment, punctuation.definition.comment	#928a83	italic
variable.other.object.cs	#83b364	—
variable, string constant.other.placeholder, variable.other.object	#92b4b1	—
constant.other.color	#aca490	—
invalid, invalid.illegal	#e3798b	—
comment.block.documentation keyword.other	#9a836f	—
punctuation	#9c9c9c	—
punctuation.section.embedded, meta.tag.metadata.doctype entity.name.tag	#3a9c93	—
punctuation.definition.variable, punctuation.definition.string, keyword.operator.heredoc, constant.other.color.rgb-value.hex, variable.other.property, meta.return.type entity.name, variable.scss, variable.other.object.property.cs	#3a9c93	—
keyword, storage.type, storage.modifier, support.function, keyword.other, source.css keyword.operator.logical, keyword.operator.expression.typeof	#cf7c9f	—
keyword.operator	#858585	—
entity.name.type.namespace, support.other.namespace, meta.attribute.name entity.other.attribute-name, keyword.operator.new	#d39a69	—
entity.other.inherited-class	#59ae8b	—
storage.type.function, support.function.magic	#cf7c7c	—
constant.other.color, meta.tag, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, keyword.other.template, keyword.other.substitution, support.type.vendored.property-name	#9c9c9c	—
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter	#cf7c9f	—
entity.name.function, meta.function-call, variable.function, keyword.other.special-method, meta.attribute.data-x entity.other.attribute-name, meta.attribute.unrecognized entity.other.attribute-name, meta.tag.metadata.doctype entity.other.attribute-name, entity.other.attribute-name.id, entity.other.attribute-name.id punctuation.definition.entity	#c1a860	—
meta.block variable.other, meta.arrow variable.parameter	#92b4b1	—
support.other.variable, string.other.link	#92b4b1	—
constant.numeric	#de7e50	—
constant.language, support.constant, constant.character, constant.escape, constant.other, keyword.other.unit	#cf7c7c	—
string, constant.other.symbol, constant.other.key, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js, punctuation.definition.string, entity.other.attribute-name.placeholder, meta.attribute-selector	#53ab62	—
entity.name, support.type, support.class, meta.use.php, markup.changed.git_gutter, support.type.sys-types, meta.function.parameter.typehinted storage.type, meta.function storage.type	#59ae8b	—
support.type	#59ae8b	—
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name	#92B4B1	—
entity.name.module.js, variable.import.parameter.js, variable.other.class.js	#FF5370	—
variable.language.this punctuation.definition.variable	#B16286	—
variable.language	#CF7C9F	—
entity.name.method.js	#82AAFF	italic
meta.class-method.js entity.name.function.js, variable.function.constructor	#82AAFF	—
entity.other.attribute-name	#cf7c7c	—
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name	#FFCB6B	italic
entity.other.attribute-name.class, punctuation.definition.entity	#59ae8b	—
source.sass keyword.control	#82AAFF	—
markup.inserted	#C3E88D	—
markup.deleted	#FF5370	—
markup.changed	#C792EA	—
string.regexp	#cf7c7c	—
constant.character.escape	#cf7c7c	—
url, link, uri	—	underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js	#82AAFF	italic
source.js constant.other.object.key.js string.unquoted.label.js	#FF5370	italic
source.json meta.structure.dictionary.json support.type.property-name.json	#92b4b1	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#c1a860	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#de7e50	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#cf7c9f	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#d39a69	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#59ae8b	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#cf7c7c	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#3a9c93	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#92b4b1	—
text.html.markdown, punctuation.definition.list_item.markdown	#aca490	—
text.html.markdown markup.inline.raw.markdown	#cf7c9f	—
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown, markup.inline.raw punctuation.definition.raw	#9c9c9c	—
markdown.heading, markup.heading \| markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown, markup.inline.raw.string	#c1a860	—
markup.italic	#92b4b1	italic
markup.bold, markup.bold string	#92b4b1	bold
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string	#92b4b1	bold
markup.underline	#92b4b1	underline
markup.quote punctuation.definition.quote	#b16286	—
markup.quote	#ACA490	—
string.other.link.title.markdown	#c1a860	—
string.other.link.description.title.markdown	#53ab62	—
constant.other.reference.link.markdown	#c1a860	—
markup.raw.block	#cf7c9f	—
markup.raw.block.fenced.markdown	#aca490	—
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end	#aca490	—
variable.language.fenced.markdown	#92b4b1	—
meta.separator	#9c9c9c	bold
markup.list punctuation.definition.list	#3a9c93	—