🌟 Material Theme for VSCode

A beautifully crafted Visual Studio Code theme inspired by Material Design, designed to enhance your coding experience with a clean, modern, and visually pleasing interface. Perfect for both frontend and backend developers, this theme is optimized for readability and productivity.

Table of Contents
✨ Features
Material Design Inspired: A modern and clean design based on Google's Material Design principles.
Optimized for Readability: Carefully chosen colors to reduce eye strain and improve focus.
Full Language Support: Enhanced syntax highlighting for JavaScript, TypeScript, React, Angular, JSON, and more.
Customizable: Easily tweak the theme to suit your preferences.
Dark Mode: A soothing dark theme that's easy on the eyes during long coding sessions.
🛠 Installation
Open Visual Studio Code.
Go to the Extensions view by clicking on the Extensions icon in the Activity Bar on the side of the window or pressing Ctrl+Shift+X
on Windows/Linux or Cmd+Shift+X
on macOS.
Search for "Material Theme for VSCode".
Click Install to install the extension.
After installation, go to the Command Palette (Ctrl+Shift+P
on Windows/Linux or Cmd+Shift+P
on macOS) and type "Preferences: Color Theme".
Select "Material Theme for VSCode - Dark" from the list.
🎨 Customization
You can customize the theme to better suit your preferences by editing your VS Code settings. Here's an example of how to tweak the theme:
"workbench.colorCustomizations": {
"[Material Theme for VSCode - Dark]": {
"editor.background": "#263238",
"editor.foreground": "#EEFFFF",
"editor.selectionBackground": "#546E7A80"
}
}
🌈 Supported Languages
This theme provides enhanced syntax highlighting for the following languages and frameworks:
- JavaScript
- TypeScript
- React (JSX/TSX)
- Angular
- JSON
- HTML
- CSS/SCSS
- Python
- C#
- PHP
- Terraform/HCL
- Shell/Bash
- Markdown
- And more!
🚀 Contributing
We welcome contributions from the community! Whether you want to improve language support, fix bugs, or enhance the documentation, your help is appreciated.
Quick Start
- Fork the repository
- Create a feature branch (
git checkout -b feat/your-feature
)
- Make your changes (see development docs for details)
- Build and test (
npm run build
)
- Commit with signing (
git commit -S -m "feat: your change"
)
- Push and create PR (
git push origin feat/your-feature
)
📚 Documentation
For detailed contribution guidelines, development setup, and project architecture:
🎯 Ways to Contribute
- 🎨 Theme Improvements: Enhance colors, add language support
- 🐛 Bug Fixes: Fix syntax highlighting issues or color problems
- 📖 Documentation: Improve guides, add examples
- 🔧 Tooling: Enhance build scripts or CI/CD
📋 Requirements
- All commits must be signed (
git commit -S
)
- Include screenshots for visual changes
- Follow Material Design color principles
- Test with multiple file types
Ready to contribute? Check out the docs directory to get started!
📜 License
This project is licensed under the MIT License. See the LICENSE file for more details.
💬 Feedback
If you have any feedback, suggestions, or issues, please open an issue on GitHub. I'd love to hear from you!
🙏 Credits
🔗 Connect with Me
🌟 Show Your Support
If you find this theme useful, please consider giving it a ⭐️ on GitHub! Your support helps us improve and maintain the project.