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.
- Features
- Installation
- Customization
- Supported Languages
- Contributing
- License
- Feedback
- Credits
- Connect with Me
- Show Your Support
-
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.
-
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+Xon Windows/Linux orCmd+Shift+Xon macOS. -
Search for "Material Theme for VSCode".
-
Click Install to install the extension.
-
After installation, go to the Command Palette (
Ctrl+Shift+Pon Windows/Linux orCmd+Shift+Pon macOS) and type "Preferences: Color Theme". -
Select "Material Theme for VSCode - Dark" from the list.
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"
}
}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!
We welcome contributions from the community! Whether you want to improve language support, fix bugs, or enhance the documentation, your help is appreciated.
- 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)
For detailed contribution guidelines, development setup, and project architecture:
- Contributing Guide - Complete contribution workflow
- Development Guide - Technical setup and build process
- Architecture Guide - Project structure and design decisions
- 🎨 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
- 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!
This project is licensed under the MIT License. See the LICENSE file for more details.
If you have any feedback, suggestions, or issues, please open an issue on GitHub. I'd love to hear from you!
-
Inspired by the Material Design.
-
Developed with ❤️ by Víctor Hugo Valle Castillo.
If you find this theme useful, please consider giving it a ⭐️ on GitHub! Your support helps us improve and maintain the project.
