One EyeCare Theme (OneDark)

Name: One EyeCare Theme (OneDark)
Author: NazmusSayad

Publisher: NazmusSayadThemes in package: 2

A dark theme for Visual Studio Code inspired by the Atom One Dark theme. This theme is designed to be easy on the eyes and focuses on the syntax highlighting of the code. This theme will help you to focus on the code and reduce the eye strain.

Color themes

VS Code preview

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

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#1E2227
activityBar.foreground#d7dae0
activityBarBadge.background#4d78cc
activityBarBadge.foreground#e6e6e6
badge.background#21252C
button.background#404754

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
meta.embedded	#ABB2BF	—
punctuation.definition.delayed.unison,punctuation.definition.list.begin.unison,punctuation.definition.list.end.unison,punctuation.definition.ability.begin.unison,punctuation.definition.ability.end.unison,punctuation.operator.assignment.as.unison,punctuation.separator.pipe.unison,punctuation.separator.delimiter.unison,punctuation.definition.hash.unison	#D46870	—
variable.other.generic-type.haskell	#B469CA	—
storage.type.haskell	#C18A57

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

One EyeCare Theme (OneDark) | Coding Theme

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