Blue Light Filter - Eye Care Theme for VS Code

A warm, eye-friendly VS Code theme designed to reduce blue light exposure and minimize eye strain during extended coding sessions. Perfect for night-time coding or anyone looking to reduce digital eye fatigue.

🎨 Features

• Two Variants: Choose between Dark and Warm Dark modes
• Reduced Blue Light: Carefully selected warm color palette to minimize blue light emission
• Eye Comfort: Designed to reduce eye strain during long coding sessions
• Complete Coverage: Full syntax highlighting for all popular languages
• Semantic Highlighting: Support for modern VS Code semantic highlighting
• Accessible: Maintains readability while being easy on the eyes

🖼️ Screenshots

Blue Light Filter - Dark

A balanced warm theme with excellent readability.

Blue Light Filter - Warm Dark

An even warmer variant for maximum blue light reduction.

📦 Installation

From VS Code Marketplace (Once Published)

1. Open VS Code
2. Go to Extensions (Ctrl+Shift+X / Cmd+Shift+X)
3. Search for "Blue Light Filter Eye Care Theme"
4. Click Install
5. Press Ctrl+K Ctrl+T / Cmd+K Cmd+T
6. Select "Blue Light Filter - Dark" or "Blue Light Filter - Warm Dark"

Manual Installation (For Testing)

1. Clone this repository
2. Install from VSIX:

   npm install -g @vscode/vsce
   cd blue-light-filter-theme
   vsce package
   code --install-extension blue-light-filter-theme-1.0.0.vsix
   

3. Press Ctrl+K Ctrl+T and select the theme

🎯 Why Blue Light Filter?

Health Benefits

• Reduced Eye Strain: Warm colors are easier on the eyes during extended use
• Better Sleep: Less blue light exposure in the evening helps maintain natural circadian rhythms
• Increased Comfort: Particularly beneficial for night-time coding sessions
• Reduced Headaches: Many users report fewer headaches with reduced blue light

Color Science

This theme uses a carefully curated warm color palette:

• Background: Deep warm browns (#1a1512 - Dark, #1c1108 - Warm Dark)
• Foreground: Soft amber and cream tones
• Accents: Warm oranges, yellows, and muted greens
• Blue Elimination: Minimal to no blue hues in the entire color scheme

🔧 Customization

You can further customize the theme in your VS Code settings:

{
  "workbench.colorCustomizations": {
    "[Blue Light Filter - Dark]": {
      "editor.background": "#1a1512",
      // Add your custom overrides here
    }
  },
  "editor.tokenColorCustomizations": {
    "[Blue Light Filter - Dark]": {
      "comments": "#7a6854"
    }
  }
}

🌟 Recommended Settings

For the best eye-care experience, consider these additional VS Code settings:

{
  // Reduce brightness
  "window.autoDetectColorScheme": false,
  
  // Smooth font rendering
  "editor.fontLigatures": true,
  "editor.fontSize": 14,
  "editor.lineHeight": 22,
  
  // Reduce animations
  "workbench.list.smoothScrolling": false,
  "editor.smoothScrolling": false,
  
  // Cursor settings
  "editor.cursorBlinking": "smooth",
  "editor.cursorSmoothCaretAnimation": "on"
}

🤝 Contributing

Contributions are welcome! This is an open-source project and we'd love your help to make it better.

1. Fork the repository
2. Create a feature branch (git checkout -b feature/improvement)
3. Make your changes
4. Test the theme thoroughly
5. Commit your changes (git commit -am 'Add some improvement')
6. Push to the branch (git push origin feature/improvement)
7. Create a Pull Request

🚀 Publishing

To VS Code Marketplace

1. Create Publisher Account

   • Go to Azure DevOps and create a Personal Access Token
   • Create a publisher at VS Code Publisher Management

2. Publish Extension

   npm install -g @vscode/vsce
   vsce login your-publisher-name
   vsce publish
   

To VS Code Official Themes

The official VS Code themes repository is at microsoft/vscode-themes. However, VS Code no longer accepts new themes into the official repository. All themes should be published to the Marketplace instead.

To make your theme more discoverable:

• Add relevant tags in package.json: "keywords": ["theme", "dark theme", "blue light filter", "eye care"]
• Create a detailed README with screenshots
• Share on social media (Twitter, Reddit r/vscode, Dev.to)
• Submit to awesome-vscode

📝 Development

# Clone and setup
git clone https://github.com/your-username/blue-light-filter-theme.git
cd blue-light-filter-theme

# Package for testing
vsce package

# Install locally
code --install-extension blue-light-filter-theme-*.vsix

🐛 Issues

Found a bug or have a suggestion? Please open an issue on our GitHub Issues page.

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• Inspired by research on blue light and eye health
• Color palette influenced by popular warm themes like Gruvbox and Nord Aurora
• Built with ❤️ for the developer community

Made with 👁️ care for developers who code long into the night

If this theme helps reduce your eye strain, please ⭐ star the repository! #� �B�l�u�e� �L�i�g�h�t� �F�i�l�t�e�r� �T�h�e�m�e� � �#� �B�l�u�e� �L�i�g�h�t� �F�i�l�t�e�r� �T�h�e�m�e� � �