Fania Theme

Name: Fania Theme
Author: Fania Ra

Publisher: Fania RaThemes in package: 1

Dark colour theme made for LaTeX, Python and Web languages.

Open in VS Code GitHub

VS Code preview

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

Fania Theme — Fania

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.

activityBarBadge.background#007acc
editor.background#1E1E1E
editor.foreground#D4D4D4
sideBarTitle.foreground#bbbbbb

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
—	#D4D4D4	—
comment, punctuation.definition.comment	#2F3F37	italic
constant, constant.numeric, constant.language, constant.character.escape, constant.other.placeholder, entity.name.tag.html, meta.tag.sgml.doctype.html, fenced_code.block.language, beginning.punctuation.definition.quote.markdown, support.constant.media.css, keyword.control.at-rule.media.css, meta.image.inline.markdown, entity.other.attribute-name.id.html, keyword.control.import.python, storage.type.function.python, punctuation.definition.list.begin.python, punctuation.definition.list.end.python, markup.quote.markdown	#C63C73	—
variable, variable.language, variable.parameter, variable.function, markup.bold.markdown, punctuation.definition.bold.markdown, markup.italic.markdown, punctuation.definition.italic.markdown, keyword.operator.combinator.css, keyword.control.loop.js, meta.item-access.python, meta.function-call.arguments.python, markup.italic.emph.latex, markup.italic.textit.latex, markup.bold.textbf.latex	#C792EA	—
markup, markup.heading, markup.bold, markup.italic, markup.underline, markup.quote, punctuation.definition.heading.markdown, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, keyword, keyword.control, keyword.operator, entity.name, entity.other.inherited-class, entity.name.section, entity.name.tag, entity.other.attribute-name, punctuation.definition.heading.markdown, variable.other.readwrite.js, punctuation.accessor.js, punctuation.definition.parameters.begin.python, punctuation.definition.parameters.end.python, punctuation.definition.keyword.latex, punctuation.definition.arguments.begin.latex, punctuation.definition.arguments.end.latex, punctuation.definition.arguments.latex, variable.parameter.function.latex, punctuation.definition.tag.xml, punctuation.support.type.property-name.begin.json, punctuation.support.type.property-name.end.json, support.type.property-name.json, punctuation.separator.dictionary.key-value.json	#3FBEF1	—
storage.type, storage.modifier, markup.underline.link.markdown, beginning.punctuation.definition.list.markdown, punctuation.definition.metadata.markdown, support.type.property-name.css, markup.underline.link.image.markdown, entity.other.attribute-name.html, meta.function-call.generic.python, punctuation.definition.function.tex, punctuation.definition.function.latex, entity.other.attribute-name.localname.xml, punctuation.definition.array.begin.json, punctuation.definition.array.end.json, punctuation.definition.bird-track.haskell	#01ffaa	—
support, punctuation.section.property-list.begin.bracket.curly.css, punctuation.section.property-list.end.bracket.curly.css, punctuation.terminator.rule.css, punctuation.separator.list.comma.css, punctuation.definition.entity.css, punctuation.separator.key-value.css, punctuation.separator.comma.haskell, punctuation.separator.key-value.html, punctuation.terminator.statement.js, punctuation.separator.colon.python, punctuation.definition.arguments.begin.python, punctuation.definition.arguments.end.python, punctuation.section.group.begin.tex, punctuation.section.group.end.tex, punctuation.separator.namespace.xml, entity.other.attribute-name.namespace.xml, punctuation.definition.dictionary.begin.json, punctuation.definition.dictionary.end.json, punctuation.separator.array.json	#00855B	—
string, punctuation.definition.string.begin, punctuation.definition.string.end, markup.inline.raw.string.markdown, markup.fenced_code.block.markdown, markup.inline.raw.string.markdown, punctuation.definition.raw.markdown, support.constant.property-value.css, support.constant.color.w3c-standard-color-name.css, markup.raw.verbatim.latex, invalid.illegal.string.quoted.double.latex	#EEF56C	—
invalid, invalid.deprecated	#FF3333	—
punctuation, markup.list.unnumbered.markdown, keyword.other.unit.px.css	#FFFFFF	—
markup.underline.link, markup.heading.markdown, entity.name.section.markdown, entity.name.section.latex	—	underline
markup.heading.markdown, entity.name.section.markdown, markup.bold	—	bold
markup.italic.emph.latex, markup.italic, markup.italic.textit.latex	—	italic
markup.italic.emph.latex	—	italicbold

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