NeoSolarized Custom

Name: NeoSolarized Custom
Author: Chamindu Vidyarathne

Publisher: Chamindu VidyarathneThemes in package: 1

Customized version of John Schlesinger's NeoSolarized theme. Designed for vibrancy extension enabled vscode window.

Open in VS Code GitHub

VS Code preview

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

NeoSolarized Custom — NeoSolarized Custom

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.activeBackground#ffffff00
activityBar.activeBorder#ffffff00
activityBar.background#010d11
activityBar.border#ffffff00
activityBarBadge.background#b58900
activityBarBadge.foreground#002b36
breadcrumb.background#010d11
breadcrumb.focusForeground#b58900
button.background#002b36
descriptionForeground#93a1a1
dropdown.background#010d11
dropdown.border#586e75
dropdown.foreground#93a1a1
editor.background#3a5e6c
editor.findMatchBackground#002b36
editor.foreground#93a1a1
editor.selectionForeground#002b36
editorGroup.border#ffffff00
editorGroupHeader.noTabsBackground#002b36
editorGroupHeader.tabsBackground#002b36
editorGroupHeader.tabsBorder#ffffff00
editorGutter.background#010d11
focusBorder#ffffff00
gitDecoration.modifiedResourceForeground#859900
input.background#010d11
input.border#ffffff00
input.foreground#93a1a1
input.placeholderForeground#93a1a1
list.activeSelectionBackground#010d11
list.activeSelectionForeground#b58900
list.focusForeground#b58900
list.focusHighlightForeground#b58900
list.hoverBackground#010d11
list.inactiveSelectionBackground#010d11
menu.background#002b36
menu.border#586e75
menu.foreground#93a1a1
menu.selectionBackground#010d11
menu.selectionForeground#93a1a1
notifications.background#010d11
notifications.border#586e75
notifications.foreground#93a1a1
pickerGroup.border#586e75
quickInput.background#010d11
quickInput.foreground#93a1a1
sideBar.background#002b36
sideBar.border#ffffff00
sideBar.dropBackground#002b36
sideBar.foreground#93a1a1
sideBarSectionHeader.background#464748
sideBarSectionHeader.border#ffffff00
sideBarTitle.foreground#93a1a1
sideBySideEditor.horizontalBorder#ffffff00
statusBar.background#002b36
statusBar.border#ffffff00
statusBar.debuggingBackground#002b36
statusBar.foreground#93a1a1
statusBar.noFolderBackground#002b36
statusBar.noFolderForeground#93a1a1
tab.activeBackground#010d11
tab.activeBorder#ffffff00
tab.activeForeground#859900
tab.border#ffffff00
tab.hoverForeground#859900
tab.inactiveBackground#002b36
tab.inactiveForeground#93a1a1
titleBar.activeBackground#aeaeae29
titleBar.activeForeground#93a1a1
titleBar.border#ffffff00

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
punctuation.accessor.js, new.expr.js, meta.var.expr.js, source.js	#B95cd3	—
variable, variable.other.readwrite, variable.other.constant, text.html.derivative, meta.jsx.children	#93A1A1	—
constant.other.color, meta.var	#dc322f	—
invalid, invalid.illegal	#FF5370	—
storage.type, storage.modifier, punctuation.separator.key-value	#859900	—
storage.type.js, meta.var.expr.js, meta.block.js, meta.function.js, source.js	#b95cd3	—
keyword	#CB4B16	—
keyword.control.conditional	#859900	—
punctuation.separator.inheritance.php, punctuation.section.embedded, punctuation.definition.block.js.jsx, punctuation.accessor, meta.objectliteral, meta.embedded.expression.js.jsx, meta.brace.round, meta.block, meta.import, entity.name.type.module, punctuation.definition.typeparameters, punctuation.definition.parameters.end, punctuation.definition.parameters.begin, punctuation.separator.comma	#dc322f	—
meta.object-literal.key	#93a1a1	—
punctuation.definition.dictionary.end.json, punctuation.definition.dictionary.begin.json	#93a1a1	—
keyword.control.import, keyword.control.from	#cb4b16	—
punctuation.terminator.statement	#bea025	—
punctuation.definition.block	#dc322f	—
punctuation.definition.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html	#dc322f	—
constant.other.color, meta.embedded.expression.js.jsx, keyword.operator, keyword.other.template, keyword.other.substitution, entity.name.tag, punctuation.definition.string.template, keyword.control.flow	#859900	—
entity.other.inherited-class, entity.name.type	#b58900	—
meta.tag.sgml, markup.deleted.git_gutter	#ff414b	—
support.class.component	#e2ad4a	—
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method	#268bd2	—
variable.parameter	#268bd2	—
meta.block variable.other	#93a1a1	—
support.other.variable, string.other.link	#f07178	—
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other, punctuation.definition.template-expression	#dc322f	—
keyword.control.trycatch	#859900	—
constant.numeric	#6c71c4	—
constant.numeric.css, keyword.other.unit.px.css, keyword.other.unit.em.css, keyword.other.unit.rem.css, constant.other.color.rgb-value.hex.css, keyword.other.unit.percentage.css, constant.numeric.scss, keyword.other.unit.px.scss, keyword.other.unit.em.scss, keyword.other.unit.rem.scss, constant.other.color.rgb-value.hex.scss, keyword.other.unit.percentage.scss	#93A1A1	—
punctuation.terminator.rule.css, punctuation.definition.constant.css, punctuation.separator.key-value.css, punctuation.terminator.rule.scss, punctuation.definition.constant.scss, punctuation.separator.key-value.scss	#dc322f	—
constant.language.null, constant.language.boolean	#d33682	—
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	#00afaf	—
constant.numeric, meta.attribute.href.html, meta.attribute.src.html, meta.tag.metadata.link.void.html	#6c71c4	—
entity.name, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types, meta.function-call.generic	#dc322f	—
support.type	#b58900	—
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, punctuation.definition.parameters.begin.bracket.round.css, punctuation.definition.parameters.end.bracket.round.css	#268bd2	—
support.constant.property-value.css	#93a1a1	—
entity.name.module.js, variable.import.parameter.js, variable.other.class.js	#FF5370	—
variable.language	#FF5370	—
entity.name.method.js	#82AAFF	—
entity.other.attribute-name	#268bd2	—
entity.other.attribute-name.class	#b58900	—
source.sass keyword.control	#82AAFF	—
punctuation.section.property-list.end.bracket.curly.css, punctuation.section.property-list.begin.bracket.curly.css	#93a1a1	—
markup.inserted	#C3E88D	—
markup.deleted	#FF5370	—
markup.changed	#C792EA	—
string.regexp	#89DDFF	—
constant.character.escape	#89DDFF	—
url, link, uri	—	underline
source.js constant.other.object.key.js string.unquoted.label.js	#FF5370	italic
source.json meta.structure.dictionary.json support.type.property-name.json	#b58900	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json	#b58900	—
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	#b58900	—
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	#b58900	—
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	#b58900	—
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	#b58900	—
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	#b58900	—
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	#b58900	—
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	#b58900	—
text.html.markdown, punctuation.definition.list_item.markdown	#93a1a1	—
text.html.markdown markup.inline.raw.markdown	#b58900	—
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown	#b58900	—
markdown.heading, markup.heading \| markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown	#cb4b16	—
markup.italic	#f07178	italic
markup.bold, markup.bold string	#f07178	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	#f07178	bold
markup.underline	#2aa198	underline
markup.quote punctuation.definition.blockquote.markdown	#65737E	—
markup.quote	—	italic
string.other.link.title.markdown	#859900	—
string.other.link.description.title.markdown	#C792EA	—
constant.other.reference.link.markdown	#FFCB6B	—
markup.raw.block	#C792EA	—
markup.raw.block.fenced.markdown	#00000050	—
punctuation.definition.fenced.markdown	#00000050	—
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end	#EEFFFF	—
variable.language.fenced.markdown	#65737E	—
meta.separator	#65737E	bold
markup.table	#EEFFFF	—
comment, comment.line.triple-slash.directive, punctuation.definition.comment	#546E7A	italic

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