Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>File Color CoderNew to Visual Studio Code? Get it now.
File Color Coder

File Color Coder

Loadguard AI

|
19 installs
| (0) | Free
Color-code files in the file explorer for better project organization
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

File Color Coder 🎨

Color-code files in the VS Code file explorer for better project organization during large refactors and development.

File Color Coder Demo

✨ Features

  • 🎨 8 Vibrant Colors: Choose from Red, Green, Blue, Yellow, Orange, Purple, Pink, or Cyan
  • 🔴 Emoji Badges: Clear visual indicators with emoji badges
  • 💾 Persistent Storage: Colors are saved per workspace and persist between sessions
  • 🎯 Right-Click Menu: Easy access through context menu in file explorer
  • 📝 Editor Integration: See color highlights when files are open
  • ⚙️ Customizable: Configure your own color schemes and badge styles
  • 🚀 Fast & Lightweight: Minimal performance impact

📸 Screenshots

Context Menu

Context Menu

Colored Files in Explorer

Colored Files

Settings

Settings

🚀 Usage

Setting a File Color

  1. Right-click on any file in the Explorer
  2. Hover over "🎨 Set File Color"
  3. Select your desired color

Clearing Colors

  • Single file: Right-click → Set File Color → Clear Color
  • All files: Command Palette (Ctrl+Shift+P) → "Clear All File Colors"

⚙️ Configuration

Access settings through VS Code Settings (Ctrl+,) and search for "File Color Coder".

Available Settings

Setting Description Default
fileColorCoder.colors Define custom color values Pre-defined color set
fileColorCoder.enableTextColor Enable/disable text coloring true
fileColorCoder.enableBackgroundColor Enable background highlights in editor true
fileColorCoder.badgeStyle Badge style: emoji, dot, or letter emoji

Custom Color Configuration Example

{
  "fileColorCoder.colors": {
    "red": { 
      "background": "#ff000033", 
      "text": "#ff0000", 
      "badge": "🔴" 
    },
    "green": { 
      "background": "#00ff0033", 
      "text": "#00aa00", 
      "badge": "🟢" 
    }
  }
}

🎯 Use Cases

  • Large Refactors: Track which files have been updated
  • Code Reviews: Mark files that need review
  • Feature Development: Group related files visually
  • Bug Tracking: Highlight files with known issues
  • Learning Codebases: Mark files as you understand them

📋 Requirements

  • VS Code version 1.74.0 or higher

💡 Tips

  • Use Red for files that need urgent attention
  • Use Green for completed/reviewed files
  • Use Yellow for work-in-progress
  • Use Blue for reference/documentation files

🐛 Known Limitations

Due to VS Code API constraints:

  • Cannot color entire file row backgrounds in the explorer
  • Colors are workspace-specific (don't transfer between workspaces)
  • Cannot color folders

📝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

📄 License

This extension is licensed under the MIT License.

🔗 Links

  • GitHub Repository
  • Report Issues
  • VS Code Marketplace

Made with ❤️ by LoadGuard AI

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft