📋 Table of Contents
✨ Features
- 🎨 Warm and organic dark theme designed for humanist aesthetics
- 👀 Optimized for long coding sessions with soft contrast
- 🖥️ Supports all major programming languages
- 🌙 Two variants: Standard and Light
🔥 The Inspiration
The Humans Theme is a warm, organic, and approachable VS Code theme. It moves away from clinical, high-contrast aesthetics in favor of earthy tones and vibrant, humanist accents. Featuring energetic oranges (#e95421 and #ff8142) against a deep charcoal background, it provides a "humans" touch to the digital workspace.
The goal is to create an environment that feels alive and creative, mirroring the passion and nuance that humans bring to technology.
🎨 Preview
Dark Theme
Light Theme
🎨 Color Palette
This theme uses a warm, humanist color palette:
| Role |
Color Name |
Hex |
| Background |
Deep Charcoal |
#191917 |
| Foreground |
Off-White |
#f3f3f3 |
| Selection |
Bright Orange |
#ff8142 |
| Comments |
Burnt Orange |
#e95421 |
| Cyan |
Soft Teal |
#50cbc3 |
| Green |
Leaf Green |
#8fb04f |
| Orange |
Warm Orange |
#f27e2a |
| Pink |
Soft Rose |
#f09690 |
| Red |
Muted Red |
#e85858 |
| Purple |
Muted Purple |
#ad7fa8 |
| Yellow |
Soft Amber |
#f2c55c |
UI Variants
| Variable |
Hex |
Purpose |
| BGDarker |
#302d2b |
Widgets, inputs |
| BGDark |
#151413 |
Sidebar, panels |
| BG |
#191917 |
Main editor background |
| BGLight |
#20201e |
Mid-tone background |
| BGLighter |
#5a5654 |
Hover states/highlights |
ANSI Terminal Colors
The terminal colors are balanced for both vibrant accents and readability:
| ANSI | Name | Hex | Bright Hex |
|------|------|-----|------------|
| 0/8 | Black | #1f2328 | #808080 |
| 1/9 | Red | #ff8142 | #ff5e26 |
| 2/10 | Green | #32cd32 | #4ee44e |
| 3/11 | Yellow | #ffd700" | #ffeb3b| | 4/12 | Blue |#1e90ff|#42a5f5| | 5/13 | Magenta |#ff69b4|#ff80ab| | 6/14 | Cyan |#00ced1|#4dd0e1| | 7/15 | White |#ffffff|#ffffff` |
🚀 Installation
VS Code Marketplace
Open VSX Registry
🎛️ Using the Theme
- Open the Command Palette (
Ctrl+Shift+P or Cmd+Shift+P)
- Type "Preferences: Color" and press Enter
- Search for "Humans"
- Select either "Humans" or "Humans Light" from the list
Recommended Settings
For the best experience, add these to your settings.json:
{
"workbench.colorTheme": "Humans",
"editor.fontFamily": "'Victor Mono', Monaco, Menlo, 'Courier New', monospace",
"editor.fontSize": 16,
"editor.lineHeight": 1.5,
"editor.fontWeight": "600",
"editor.wordWrap": "on",
}
🎨 Theme Variants
- Humans - Standard dark version with warm, humanist accents
- Humans Light - Clean light version for day-time coding
🛠 Development
Prerequisites
Setup
# Install dependencies
pnpm install
# Build the theme
pnpm run build
# Watch for changes and build automatically
pnpm run watch
# Package the extension
pnpm run package
Project Structure
├── src/
│ └── humans.yml # Theme source file (YAML)
├── theme/
│ ├── humans.json # Generated theme
│ └── humans-light.json
├── scripts/
│ ├── build.js # Build script
│ └── generate.js # Theme generator
├── images/
│ └── icon.png # Extension icon
🤝 Contributing
Contributions are welcome! If you find any issues or have suggestions for improvements, please feel free to:
- Open an issue
- Submit a pull request
- Share your feedback
📬 Stay Updated
For updates, star this repository and follow me on GitHub.
💖 Credits
- Inspired by humanist design and organic aesthetics
- Special thanks to the VS Code community for their amazing theming support
- This theme is based on the Dracula Theme schema, with colors adapted for the Humans aesthetic.
📄 License
This project is licensed under the MIT License - see the LICENSE file for details.
