Easy Light

Name: Easy Light
Author: fransyrcc

Publisher: fransyrccThemes in package: 1

A VSCode theme for those who prefer light mode and avoid that halation effect

Open in VS Code GitHub

VS Code preview

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

Easy Light — Easy Light

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Light+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#d0d0cf
activityBar.border#ffffff00
activityBar.foreground#525252
activityBarBadge.background#008bb1cf
activityBarBadge.foreground#ffffff
badge.background#008bb1cf
badge.foreground#ffffff
breadcrumb.activeSelectionForeground#000000
breadcrumb.background#ffffff
breadcrumb.focusForeground#000000
breadcrumb.foreground#7b7b7b
breadcrumbPicker.background#fafafa
button.background#008bb1cf
button.foreground#ffffff
diffEditor.insertedTextBackground#91b85923
diffEditor.removedTextBackground#e5383517
editor.background#e3e3e3
editor.lineHighlightBackground#dedddd
editor.lineHighlightBorder#ffffff00
editorBracketMatch.background#e9520027
editorBracketMatch.border#e952006d
editorHoverWidget.background#e0e0e0
editorHoverWidget.border#c1c0c0
editorIndentGuide.activeBackground#bb7803
editorLineNumber.activeForeground#976391
editorLineNumber.foreground#97639148
editorLink.activeForeground#000000
input.background#edecec
input.border#929292
list.activeSelectionBackground#b1b1b167
list.activeSelectionForeground#4e4e4e
list.dropBackground#b1b1b11e
list.errorForeground#bb1000
list.filterMatchBackground#fff
list.filterMatchBorder#fff
list.focusBackground#0065FF33
list.focusForeground#4e4e4e
list.highlightForeground#4283F5
list.hoverBackground#b1b1b13a
list.hoverForeground#4e4e4e
list.inactiveFocusBackground#b1b1b133
list.inactiveSelectionBackground#b1b1b11e
list.inactiveSelectionForeground#4e4e4e
list.invalidItemForeground#A9A9AA
list.warningForeground#8f0000
listFilterWidget.background#FFF
listFilterWidget.noMatchesOutline#ff0000
listFilterWidget.outline#FFF
panel.background#e3e3e3
panel.border#b2b2b2
panelTitle.activeBorder#830083
panelTitle.activeForeground#830083
panelTitle.inactiveForeground#3a013a
sideBar.background#e3e3e3
sideBar.border#b2b2b2
tab.activeBackground#ffffff
tab.activeBorder#083d77
tab.border#ececec
terminal.ansiBlack#000000
terminal.ansiBrightGreen#68932c
terminal.ansiBrightMagenta#881af7
terminal.ansiBrightRed#c20300
tree.indentGuidesStroke#c5c5c5

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
variable.other.object.property.js	—	bold
comment, punctuation.definition.comment, string.quoted.docstring	#B2B2B2	italic
variable.other.readwrite.alias.js, variable.other.readwrite.js, string constant.other.placeholder	#111111	—
constant.other.php	#FB5607	—
invalid, invalid.illegal	#E53935	—
invalid.deprecated	#7C4DFF	—
keyword, storage.type, storage.modifier	#7C4DFF	—
Keyword, Storage	—	italic
constant.other.color, punctuation.definition.tag, punctuation, punctuation.section.embedded, keyword.other.template, keyword.other.substitution	#5c4dff	—
punctuation.definition.entity.css	#0746ce	—
keyword.control	#005092	—
punctuation.separator.inheritance.php	#b5b4b4	—
punctuation.section.embedded	#a70b0b	—
meta.other.type.phpdoc.php support.class.php	—	bold
support.class.builtin.js, meta.definition.method entity.name.function	#9d008b	—
meta.object-literal.key.js	#0092B3FA	—
punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html	#083D77	—
punctuation.separator.comma.js, punctuation.separator.comma.tsx, punctuation.definition.block.js, punctuation.definition.block.tsx, punctuation.definition.parameters.begin.js, punctuation.definition.parameters.begin.tsx, punctuation.definition.parameters.end.js, punctuation.definition.parameters.end.tsx	#83338E	—
keyword.control	—	italic
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter	#9d008b	—
support.function, variable.function, keyword.other.special-method	#5d0cce	—
support.function.constructor.php	#9d008b	—
source.cpp meta.block variable.other	#FF5370	—
variable.other.constant	#FF5370	—
support.other.variable, string.other.link	#FF5370	—
constant.numeric, constant.language, support.constant, constant.character, constant.escape	#eb4802	—
keyword.other	#7C4DFF	—
keyword.other.phpdoc.php	#b5b4b4	—
meta.function.parameters.php support.class.php	#91B859	—
entity.other.attribute-name.class	#108f87
keyword.control	#032093
entity.name.function	#165ac6
variable.parameter.function.language.special, variable.parameter	#EB4802	—
meta.array.literal.js	#000000	—
string.quoted.single.js	#018333	—
string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js	#238227b1	—
support.type	#8796B0	—
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	#083D77	—
meta.property-list.css, meta.property-value.css	#083D77	—
variable.css, variable.scss, variable.less	#083D77	—
entity.name.module.js, variable.import.parameter.js, variable.other.class.js	#E53935	—
variable.language	#E53935	underline
entity.name.method.js	#6182B8	—
meta.class-method.js entity.name.function.js, variable.function.constructor	#6182B8	—
entity.other.attribute-name	#0092b3fa	—
entity.other.attribute-name.id.css	#9d008b
entity.name.tag.css	#a56900
source.sass keyword.control	#6182B8
string.regexp	#39ADB5	—
constant.character.escape	#39ADB5	—
url, link, uri	—	underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js	#6182B8	—
source.js constant.other.object.key.js string.unquoted.label.js	#E53935	—
string.quoted.double.json	#018333	—
source.json meta.structure.dictionary.json support.type.property-name.json	#9d008b	—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json, entity.name.tag.localname.xml	#083D77	—
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	#3A86FF	—
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	#ae6262	—
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	#FF006E	—
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	#39ADB5	—
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	#84ca02	—
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	#7C4DFF	—
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	#91B859	—
text.html.markdown, text.html.markdown meta.dummy.line-break, punctuation.definition.list_item.markdown	#5c5c5c	—
text.html.markdown string, markup.inline.raw.string.markdown, string.other.link.description.title.markdown	#018333	—
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, punctuation.definition.metadata.markdown	#3A86FF	—
text.html.markdown markup.inline.raw.markdown	#7C4DFF	—
markup.italic, markup.bold, markup.bold string, 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	#FF5370	bold
markup.heading.markdown	#3A86FF	—
string.other.link.title.markdown	#FF5370	—
constant.other.reference.link.markdown	#FF5370	—
markup.raw.block	#606060	—
markup.fenced_code.block.markdown	#B2B2B2	—
markup.italic, markup.quote	—	italic
markup.underline	—	underline
meta.separator.markdown	#3A86FF	bold
token.info-token	#316BCD	—
token.warn-token	#CD9731	—
token.error-token	#CD3131	—
token.debug-token	#800080	—
punctuation.definition.template-expression.begin.js, punctuation.definition.template-expression.end.js	#800080	—

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