🌺 Lilo's Island

"Ohana means family. Family means nobody gets left behind."

A dark, high-contrast VS Code theme inspired by the lush Hawaiian landscapes, warm ocean waters, and vivid characters of Lilo & Stitch. Deep jungle foliage backgrounds meet a bold palette of Lilo's red dress, tropical hibiscus pinks, Stitch's electric cyan, and glowing jungle greens — dramatic, immersive, and unmistakably Hawaiian.

🎨 The Palette

Every color in this theme is drawn directly from the world of the movie.

| Token | Color | Inspired By | |---|---|---| | Keywords if return import | 🔴 #e8253a Lilo Red | Lilo's iconic red dress | | Storage class const function | 🌸 #ff6eb4 Hibiscus Pink | Hawaiian hibiscus flowers | | Functions / Methods | 🩵 #3de8f5 Stitch Cyan | Stitch's electric blue fur | | Classes / Types | 💗 #ff9ed2 Pale Orchid | Stitch's lighter markings | | Strings | 🏖️ #d4a96a Sandy Gold | Hawaiian beach sand | | Numbers / Operators | 🌊 #00c9b1 Ocean Teal | Hawaiian ocean waters | | Booleans / Constants | 💙 #4a90e2 Ocean Blue | Stitch's deep blue eyes | | Comments | 🌿 #52d68a Jungle Green | Tropical jungle foliage | | Properties | 🌅 #7af5f0 Seafoam | Sunlight sparkling on water | | Background | 🌑 #0d1a0f Foliage Dark | Dense Hawaiian jungle at night | | Cursor | 🔴 #e8253a | Lilo's red dress |

📸 Preview

💡 Want to see the real colors before installing? Open lilos-island-preview.html in your browser for a fully rendered interactive preview — live code sample, complete palette swatches, and install instructions all in one place.

To add your own screenshots:

1. Install the theme and open a code file you like
2. Take a screenshot (Cmd+Shift+4 on Mac, Win+Shift+S on Windows)
3. Save it to a screenshots/ folder in the repo root
4. The images above will show up automatically on GitHub

🚀 Installation

Option A — Manual (No extensions required)

1. Navigate to your VS Code extensions folder:

# macOS / Linux
~/.vscode/extensions/

# Windows
%USERPROFILE%\.vscode\extensions\

2. Create a new folder called lilos-island-theme and inside it a themes subfolder:

lilos-island-theme/
├── package.json
└── themes/
    └── lilos-island-color-theme.json

3. Place lilos-island-color-theme.json in the themes/ folder and package.json in the root.

4. Restart VS Code completely.

5. Open the Command Palette (Ctrl+Shift+P / Cmd+Shift+P), type Color Theme, and select Lilo's Island.

Option B — From VSIX (if packaged)

1. Open the Command Palette → Extensions: Install from VSIX...
2. Select the .vsix file
3. Restart VS Code
4. Select the theme via File → Preferences → Color Theme

🌊 Semantic Highlighting

This theme supports VS Code Semantic Highlighting for richer, more accurate syntax coloring. It's enabled by default in VS Code 1.60+. If colors look off, make sure it's turned on in your settings:

"editor.semanticHighlighting.enabled": true

🛠️ Recommended Settings

These settings pair beautifully with Lilo's Island:

{
  "editor.fontFamily": "Fira Code, JetBrains Mono, Cascadia Code",
  "editor.fontLigatures": true,
  "editor.fontSize": 14,
  "editor.lineHeight": 1.8,
  "editor.cursorBlinking": "smooth",
  "editor.cursorSmoothCaretAnimation": "on",
  "editor.bracketPairColorization.enabled": true,
  "editor.guides.bracketPairs": "active",
  "workbench.colorTheme": "Lilo's Island"
}

🌺 Languages Supported

Lilo's Island has been carefully tuned for:

• JavaScript & TypeScript (including JSX/TSX)
• Python
• HTML & CSS / SCSS
• JSON & YAML
• Markdown
• Rust, Go, Java, C/C++
• Shell / Bash
• And most other languages via VS Code's TextMate grammar system

🐾 About

Built with love for anyone who codes with the spirit of Ohana. The theme was designed to feel like writing code on a warm Hawaiian night — the deep dark foliage around you, the glow of a sunset still on the horizon, the ocean just out of sight.

No family gets left behind. No syntax goes unhighlighted.

Made with 🌺 — Ohana means nobody gets left behind.