Kiro Hiberbee Theme

A community-maintained Hiberbee dark theme optimized for Kiro editor with authentic colors and syntax highlighting.

🎨 Theme Preview

This theme brings the beautiful cyberpunk-inspired Hiberbee color palette to your coding environment with:

• Deep dark background (#171615) for reduced eye strain
• Vibrant accent colors with the signature Hiberbee yellow (#FFB900)
• Carefully crafted syntax highlighting for better code readability
• Complete UI consistency across all editor elements

📦 Installation

Option 1: Install the VSCode Extension

# Install the packaged extension
code --install-extension output/hiberbee-theme.vsix

Then in VSCode:

1. Open Command Palette (Ctrl+Shift+P / Cmd+Shift+P)
2. Type "Preferences: Color Theme"
3. Select "Hiberbee Theme"

Option 2: Use with Kiro Theme Generator

This project includes a powerful theme generator that can convert VSCode themes to Kiro-compatible format.

cd kiro-theme-generator
npm install
npm run build

# Generate theme from current VSCode theme
npm start generate

# Package as VSCode extension
npm start package ./hiberbee-fixed-theme.json --name "your-theme" --publisher "your-name"

🛠️ Kiro Theme Generator Features

Core Functionality

• Theme Conversion: Convert VSCode themes to Kiro-compatible format
• Color Extraction: Intelligent color mapping with fallback support
• Extension Packaging: Create installable VSCode extensions (.vsix)
• Theme Validation: Built-in validation with accessibility checks
• CLI Interface: Comprehensive command-line tools

Available Commands

# Generate theme from current VSCode theme
kiro-theme-gen generate [options]

# Package theme as VSCode extension
kiro-theme-gen package <theme-file> [options]

# Validate theme file
kiro-theme-gen validate <theme-file> [options]

# List available VSCode themes
kiro-theme-gen list [options]

# Install theme to Kiro
kiro-theme-gen install <theme-file> [options]

# Show system information
kiro-theme-gen info

Package Command Options

kiro-theme-gen package <theme-file> \
  --name "theme-name" \
  --display-name "Display Name" \
  --description "Theme description" \
  --publisher "your-publisher-name" \
  --author "Your Name" \
  --keywords "dark,theme,kiro" \
  --license "MIT" \
  --version "1.0.0"

🎯 Key Features

🌈 Authentic Hiberbee Colors

• Based on official Windows Terminal color specifications
• Signature yellow (#FFB900) for accents and highlights
• Cyberpunk-inspired color palette
• High contrast for excellent readability

🔧 Advanced Color Processing

• Intelligent Mapping: Converts VSCode colors to Kiro format with smart fallbacks
• Hiberbee Optimization: Special handling for Hiberbee theme characteristics
• Accessibility Validation: Automatic contrast ratio checking for WCAG compliance
• Error Handling: Graceful handling of missing files and invalid themes

📋 Comprehensive Syntax Highlighting

• Keywords: #ee7762 (red)
• Strings: #ffd866 (yellow)
• Comments: #808080 (gray, italic)
• Functions: #92d923 (green)
• Variables: #b6b3eb (light purple)
• Constants: #0078d7 (blue)

🏗️ Development Tools

• Full TypeScript support with strict typing
• Comprehensive test suite with Jest
• ESLint configuration for code quality
• Modular architecture for easy extension

📁 Project Structure

kiro-hiberbee-theme/
├── kiro-theme-generator/          # Main theme generator project
│   ├── src/
│   │   ├── components/            # Core business logic
│   │   │   ├── extension-packager.ts    # VSCode extension packaging
│   │   │   ├── color-extractor.ts       # Color extraction and mapping
│   │   │   ├── theme-parser.ts          # Theme file parsing
│   │   │   ├── theme-validator.ts       # Theme validation
│   │   │   └── ...
│   │   ├── utils/                 # Utility functions
│   │   ├── types/                 # TypeScript definitions
│   │   ├── interfaces/            # Interface definitions
│   │   ├── constants/             # Configuration constants
│   │   └── cli.ts                 # Command-line interface
│   ├── output/                    # Generated theme packages
│   │   └── hiberbee-theme.vsix    # Packaged VSCode extension
│   ├── tests/                     # Test files
│   └── package.json
├── hiberbee-fixed-theme.json      # Fixed Hiberbee theme source
└── README.md                      # This file

🚀 Development

Prerequisites

• Node.js 18+
• npm or yarn
• TypeScript

Setup

# Clone the repository
git clone <repository-url>
cd kiro-hiberbee-theme/kiro-theme-generator

# Install dependencies
npm install

# Build the project
npm run build

# Run tests
npm test

# Run in development mode
npm run dev

Testing

# Run all tests
npm test

# Run tests in watch mode
npm run test:watch

# Run specific test suites
npm run test:unit
npm run test:integration

# Run with coverage
npm run test:all

🎨 Color Reference

Official Hiberbee Palette

Color	Hex	Usage
Background	#171615	Editor background
Foreground	#CFCECD	Main text
Accent Yellow	#FFB900	Highlights, cursor, focus
Blue	#0078D7	Constants, types
Red	#EE7762	Keywords, errors
Green	#92D923	Functions, strings
Purple	#B6B3EB	Variables
Cyan	#57D1EB	Special elements

Terminal Colors (ANSI)

Type	Normal	Bright
Black	#070605	#171615
Red	#F25022	#EE7762
Green	#92D923	#B7E66E
Yellow	#FFB900	#FFD866
Blue	#0078D7	#409CFF
Magenta	#A97CF8	#A89FEC
Cyan	#57D1EB	#8EDCE5
White	#CFCECD	#FFFEFD

📋 Requirements

For Theme Generator

• Node.js 18+
• VSCode (for theme detection and testing)
• VSCE (for .vsix packaging) - installed automatically

For Theme Usage

• VSCode 1.74.0+
• Kiro editor (for Kiro-specific features)

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.

Development Guidelines

1. Follow the existing code style (ESLint configuration)
2. Add tests for new features
3. Update documentation as needed
4. Ensure all tests pass before submitting

📄 License

MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• Hiberbee Team for the original theme design and color palette
• VSCode Theme Community for inspiration and best practices
• Kiro Editor community for feedback and testing

🔗 Related Links

• Original Hiberbee Themes
• VSCode Theme Development Guide
• Kiro Editor

---

Note: This is a community-maintained version optimized for Kiro editor. It is not officially affiliated with the original Hiberbee project, but faithfully implements their color specifications and design principles.