Claude Paper Theme for VS Code

A warm, paper-like VS Code theme inspired by Claude AI - featuring unique "milk tea terminal" design and comprehensive documentation.

🎨 Two Beautiful Themes: Light (Paper) + Dark (Modern) 📚 Complete Documentation: 1600+ lines of guides ♿ WCAG AAA: 12:1 (light) / 14:1 (dark) contrast ratio 🍵 Innovative Design: Unique "milk tea terminal" color scheme

This theme is designed for those who appreciate a calm, minimalist, and readable environment. It uses a warm, off-white background and a carefully selected palette for syntax highlighting to reduce eye strain and improve code comprehension.

Current Directory Screenshot

Features

Warm & Focused UI: A gentle, paper-like background (#FAF9F5) that's easy on the eyes during long coding sessions.
Enhanced HTML/CSS Support: Comprehensive syntax highlighting for web development with proper color-coding for tags, attributes, properties, and values.
Harmonious Highlighting: Syntax colors are carefully tuned to be clear and aesthetically pleasing, inspired by Claude's official palette.
Consistent Design: Provides a cohesive look and feel across the entire VS Code workbench, from the editor to the terminal.
Clarity First: The color scheme prioritizes readability and semantic meaning, helping you understand your code at a glance.

Color Palette

Main Colors

Background: #FAF9F5 (Warm Off-White)
Foreground: #1F1E1D (Dark Brown-Gray)
Accent: #1C6BBB (Claude Blue)
Emphasis: #C96442 (Terracotta Orange)

Syntax Highlighting

Keywords: #D73A83 (Pink)
Types & Classes: #8A46CE (Purple)
Functions: #1F6FE4 (Blue)
Numbers & Constants: #2D8F8F (Cyan)
Parameters: #B56613 (Orange-Brown)
Strings: #26831A (Green)
Comments: #6F6F78 (Gray)

HTML & CSS Support

HTML Tags: #D73A83 (Pink)
HTML Attributes: #1F6FE4 (Blue)
HTML Values: #26831A (Green)
CSS Properties: #B56613 (Orange-Brown)
CSS Values: #2D8F8F (Cyan)
CSS Selectors: #8A46CE (Purple)

What's New in v0.0.6 🎉

Complete Dark Theme: Enhanced from 60% to 95% completeness (650+ lines)
30+ New Syntax Rules: Markdown, JSON, YAML, decorators, and more
Terminal Colors: Full 16-color ANSI palette for both themes
Git Integration: Visual feedback for added, modified, deleted files
Notebook Support: Jupyter/VS Code Notebook styling
Comprehensive Docs: 1600+ lines of guides and references

View Full Changelog

Installation

From GitHub

Download the latest release from Releases
Open VS Code Extensions sidebar (Ctrl+Shift+X or Cmd+Shift+X)
Click the ... menu → Install from VSIX...
Select the downloaded .vsix file
Open Command Palette (Ctrl+Shift+P) → Preferences: Color Theme
Select Claude Paper Light (Local) or Claude Paper Dark (Local)

From Source

git clone https://github.com/Jial-coder/claude-light-theme.git
cd claude-light-theme
npm install
npm run package
code --install-extension claude-paper-theme-local-0.0.6.vsix

Customization

You can override the theme's colors in your personal settings.json file.

{
  "workbench.colorCustomizations": {
    "[Claude Light Theme]": {
      "editor.background": "#FAFAFA", // Make it a bit whiter
      "activityBar.background": "#F5F3EE"
    }
  },
  "editor.tokenColorCustomizations": {
    "[Claude Light Theme]": {
      "comments": "#888888", // Make comments a bit lighter
      "strings": "#008000"  // A different shade of green for strings
    }
  }
}

📚 Documentation

Color Guide - Complete color palettes and customization guide
Testing Guide - Comprehensive testing checklist
Theme Analysis - Design decisions and technical details
Optimization Summary - v0.0.6 improvements overview
Next Steps - Roadmap and future plans

🎨 Features

Light Theme (Paper)

Warm Paper Background: #fffaf2 - Easy on the eyes
Milk Tea Terminal: #e4d4c2 - Unique terminal design
WCAG AAA: 12:1 contrast ratio
Complete UI Coverage: 430+ configuration lines

Dark Theme (Modern)

Deep Black Background: #1A1A1A - Professional look
Enhanced Terminal: #2A2A2A - Slightly lighter than editor
WCAG AAA: 14:1 contrast ratio
Complete UI Coverage: 650+ configuration lines

Both Themes Include

✅ Complete syntax highlighting (46+ rules)
✅ Terminal ANSI colors (16 colors)
✅ Git decorations
✅ Notebook support
✅ Peek View styling
✅ Diff editor colors
✅ Markdown, JSON, YAML support

🤝 Contributing

Contributions are welcome! Please read our Contributing Guide for details.

Ways to Contribute

🐛 Report bugs via Issues
💡 Suggest features or improvements
🎨 Share your custom color schemes
📖 Improve documentation
⭐ Star the repository if you like it!

📝 License

This theme is licensed under the MIT License.

🙏 Acknowledgments

Inspired by Claude AI's clean interface
Built with ❤️ for the VS Code community
Special thanks to all contributors

Made with ❤️ by Jial-coder Repository: https://github.com/Jial-coder/claude-light-theme