TypeScript Beta Theme

A custom VS Code color theme with TypeScript-focused syntax highlighting, available in both light and dark variants.

Installation

Method 1: Manual Installation (Recommended)

1. Copy the typescript-beta-theme folder to your VS Code extensions directory:

   • macOS: ~/.vscode/extensions/
   • Windows: %USERPROFILE%\.vscode\extensions\
   • Linux: ~/.vscode/extensions/

2. Restart VS Code

3. Open Command Palette (Cmd/Ctrl + Shift + P)

4. Search for "Preferences: Color Theme"

5. Select either:

   • TypeScript Beta Light - Clean light theme with TypeScript optimizations
   • TypeScript Beta Dark - Dark theme with enhanced contrast

Method 2: Package as VSIX (Advanced)

1. Install vsce globally: npm install -g vsce
2. Navigate to the theme directory: cd typescript-beta-theme
3. Package the extension: vsce package
4. Install the generated .vsix file via VS Code's Extensions view

Features

• TypeScript-optimized color scheme with enhanced syntax highlighting
• Dual themes: Light and dark variants
• Enhanced readability with carefully chosen contrast ratios
• Comprehensive language support including JavaScript, TypeScript, CSS, HTML, JSON, and more
• Semantic token support for modern editors

Color Palette

Light Theme

• Background: #FFFFFF
• Foreground: #000000
• Comments: #008000
• Keywords: #0000FF → #0451A5
• Strings: #A31515
• Functions: #795E26
• Types: #1c6277

Dark Theme

• Background: #1E1E1E
• Foreground: #D4D4D4
• Comments: #6A9955
• Keywords: #569cd6
• Strings: #ce9178
• Numbers: #b5cea8

Customization

You can modify the theme files in /themes/ to customize colors:

• typescript-beta-light.json - Light theme configuration
• typescript-beta-dark.json - Dark theme configuration

After making changes, restart VS Code to see the updates.

Contributing

Feel free to open issues or submit pull requests to improve the theme!