Kislay Theme - VS Code Extension
A comprehensive VS Code extension with 11 beautiful themes inspired by the most popular themes in the marketplace. Cycle through professional color schemes with a single command. Features enhanced syntax highlighting for all programming languages.
Features
- 11 Professional Themes: From light to dark, OLED to vibrant colors
- Enhanced Syntax Highlighting: Comprehensive color support for all programming languages
- Popular Theme Inspirations: Colors from One Dark Pro, Dracula, GitHub Theme, and more
- Quick Theme Cycling: Switch between all themes instantly with one command
- OLED Support: True black theme for OLED displays
- VS Code Integration: Seamlessly integrates with VS Code's theme system
Installation
From VSIX Package
- Download the
.vsix file from the releases
- In VS Code, go to Extensions (Ctrl+Shift+X)
- Click the "..." menu and select "Install from VSIX..."
- Choose the downloaded
.vsix file
From Source
- Clone this repository
- Install dependencies:
npm install
- Package the extension:
npm run package
- Install the generated
.vsix file in VS Code
Usage
Command Palette
- Open the Command Palette (Ctrl+Shift+P)
- Type "Cycle Through All Themes"
- Press Enter to cycle through themes
Keyboard Shortcut
You can add a custom keyboard shortcut by:
- Open Keyboard Shortcuts (Ctrl+K Ctrl+S)
- Search for "Cycle Through All Themes"
- Click the + icon to add your preferred shortcut
Enhanced Syntax Highlighting
Each theme includes comprehensive syntax highlighting for:
- Keywords: Control flow, storage types, modifiers
- Strings: Single, double, triple quotes, templates
- Comments: Line comments, block comments, various comment styles
- Constants: Numbers, characters, language constants
- Variables: Parameters, language variables
- Functions & Classes: Entity names, support functions
- Punctuation: Brackets, operators, separators
- Meta: Preprocessors, imports, exports
- Invalid Code: Error highlighting
All 11 Themes Included
🌞 Light Theme
- Inspired by: GitHub Theme, Ayu Light
- Clean white background with subtle gray accents
- Red keywords (#D73A49), blue strings (#032F62), gray comments (#6A737D)
- Purple functions and classes (#6F42C1)
🌙 Dark Theme
- Inspired by: One Dark Pro, Dracula
- Classic dark editor background (#282C34)
- Purple keywords (#C678DD), green strings (#98C379), gray comments (#5C6370)
- Blue functions (#61AFEF), yellow classes (#E5C07B)
⚫ OLED Theme
- Inspired by: Night Owl, OLED-optimized themes
- True black background (#000000) for OLED displays
- Red keywords (#FF6B6B), teal strings (#4ECDC4), gray comments (#666666)
- Pastel accent colors for functions and classes
🔥 Pro Dark Theme
- Inspired by: One Dark Pro
- Dark background (#282C34) with light gray text (#ABB2BF)
- Purple keywords (#C678DD), green strings (#98C379), gray comments (#5C6370)
- Blue functions (#61AFEF), yellow classes (#E5C07B)
🧛 Vampire Theme
- Inspired by: Dracula Official
- Dark purple background (#282A36) with light text (#F8F8F2)
- Pink keywords (#FF79C6), yellow strings (#F1FA8C), blue comments (#6272A4)
- Green functions (#50FA7B), cyan classes (#8BE9FD)
🐙 Git Dark Theme
- Inspired by: GitHub Dark
- Very dark background (#0D1117) with light gray text (#C9D1D9)
- Red keywords (#FF7B72), blue strings (#A5D6FF), gray comments (#8B949E)
- Purple functions (#D2A8FF), pink classes (#FFA198)
🌅 Mirage Theme
- Inspired by: Ayu Dark
- Dark blue-gray background (#0F1419) with warm text (#B3B1AD)
- Orange keywords (#FFCC66), yellow strings (#C2B36E), gray comments (#5C6773)
- Blue functions (#39BAE6), orange classes (#FFB454)
🦉 Night Owl Theme
- Inspired by: Night Owl
- Deep blue background (#011627) with light blue text (#D6DEEB)
- Purple keywords (#C792EA), green strings (#ADD1B8), teal comments (#637777)
- Blue functions (#82AAFF), orange classes (#FFCB8B)
💜 Purple Haze Theme
- Inspired by: Shades of Purple
- Dark purple background (#2D2A44) with light text (#F8F8F2)
- Purple keywords (#C594C5), blue strings (#A3BFFA), purple comments (#5D4D7A)
- Cyan functions (#45D9FD), orange classes (#FFB86C)
🌃 Tokyo Storm Theme
- Inspired by: Tokyo Night Storm
- Dark blue background (#1A1B26) with light blue text (#A9B1D6)
- Purple keywords (#BB9AF7), green strings (#9ECE6A), blue comments (#565F89)
- Blue functions (#7AA2F7), orange classes (#FF9E64)
🎨 Monokai Pro Theme
- Inspired by: Monokai Pro
- Dark gray background (#2D2A2E) with light text (#F8F8F2)
- Pink keywords (#F92672), yellow strings (#E6DB74), gray comments (#75715E)
- Green functions (#A6E22E), purple numbers (#AE81FF)
Color Palette Sources
The themes incorporate colors from these popular VS Code themes:
- One Dark Pro: Purple keywords, green strings, blue functions
- Dracula: High contrast colors, vibrant pink and yellow accents
- GitHub Theme: Clean, professional color scheme
- Ayu: Modern minimalistic design with warm colors
- Night Owl: Muted, high-contrast dark theme
- Shades of Purple: Bold purple tones and vibrant accents
- Tokyo Night: Sleek dark design with blue undertones
- Monokai Pro: Professional theme with customizable colors
Development
Prerequisites
- Node.js (version 14 or higher)
- VS Code Extension Development Host
Setup
Install dependencies:
npm install
Open the project in VS Code
Press F5 to launch the Extension Development Host
In the new VS Code window, use Ctrl+Shift+P and search for "Cycle Through All Themes"
Building
To create a distributable package:
npm run package
This will create a .vsix file that can be installed in VS Code.
File Structure
theme-changer-extension/
├── package.json # VS Code extension manifest
├── extension.js # Extension activation and command logic
├── themes/ # Theme definitions
│ ├── light-theme.json # Light theme configuration
│ ├── dark-theme.json # Dark theme configuration
│ ├── oled-theme.json # OLED theme configuration
│ ├── pro-dark-theme.json # Pro Dark theme configuration
│ ├── vampire-theme.json # Vampire theme configuration
│ ├── git-dark-theme.json # Git Dark theme configuration
│ ├── mirage-theme.json # Mirage theme configuration
│ ├── night-owl-theme.json # Night Owl theme configuration
│ ├── purple-haze-theme.json # Purple Haze theme configuration
│ ├── tokyo-storm-theme.json # Tokyo Storm theme configuration
│ └── monokai-pro-theme.json # Monokai Pro theme configuration
└── README.md # This file
Extension Configuration
The extension contributes:
- 11 themes: Complete collection of professional themes with enhanced syntax highlighting
- One command:
themeChanger.toggleTheme - Cycle Through All Themes
Contributing
- Fork the repository
- Create a feature branch
- Make your changes
- Test the extension
- Submit a pull request
License
MIT License - feel free to use and modify this extension.
Publisher
Published by kislay
Version History
- 2.1.0: Enhanced syntax highlighting for all programming languages
- 2.0.0: Major release with 11 comprehensive themes inspired by popular themes
- 1.0.0: Initial release with basic theme functionality
| |