King IDE is a lightweight desktop IDE built for developers who live in the terminal. It combines a powerful terminal emulator with a file explorer, git diff viewer, and split pane management, all wrapped in a clean dark theme inspired by Tokyo Night.
Note: This is an MVP and a proof of concept. The goal is to validate the core ideas before potentially rewriting it in Tauri + Rust for better performance and smaller bundle size.
Terminal Emulator Full featured terminal powered by xterm.js with proper shell integration, colors, clickable links, and auto resize.
Tmux Style Splits Split your workspace horizontally or vertically using familiar tmux keybindings. Navigate between panes with arrow keys. No mouse needed.
Multi Tab Support Open as many terminal tabs as you need. Each tab has its own independent pane tree so you can organize different projects or tasks.
File Explorer Add project folders to the sidebar and browse your files in a collapsible tree view. See folder paths, icons, and git status at a glance.
Text Editor
Full code editor powered by CodeMirror 6 with syntax highlighting for JavaScript, TypeScript, Python, Rust, CSS, HTML, JSON, Java, C++, and Markdown. Open files from the sidebar, edit side by side with split panes, save with Cmd+S, and get native unsaved changes dialogs on close. Binary and large files are detected and handled gracefully.
Git Integration See your current branch, modified file count, and staged file count right in the sidebar and status bar. Everything updates automatically.
Diff Viewer Built in git diff viewer with tabs for unstaged and staged changes. Switch between unified and side by side views. GitHub style colors make additions and deletions easy to spot.
Multi Theme Support
Seven built in themes to match your style: Tokyo Night (default), Crimson, Amethyst, Midnight, Daylight, Graphite, and Matrix. Switch themes instantly from the settings panel (Ctrl+B t). Your choice is saved automatically and applied on startup, including terminal colors.
Terminal Wallpaper Set any image as your terminal background. Adjust opacity (10-100%), blur (0-20px), and display mode (cover, contain, fill, tile, center) to get the look you want. The terminal becomes transparent so the wallpaper shows through. Settings persist across sessions.
Eight built-in themes you can combine with any wallpaper. Open settings with Ctrl+B t, pick a theme and wallpaper, adjust opacity and blur — done.
 Amethyst + wallpaper |
 Daylight + wallpaper |
 TemPad + wallpaper |
 Midnight + wallpaper |
Themes apply to the entire UI including terminal colors. Wallpaper settings (image, opacity, blur, display mode) are independent of the theme and persist across sessions.
King IDE uses a prefix mode similar to tmux. Press Ctrl+B to enter command mode, then press the action key.
| Keys | Action |
|---|---|
Ctrl+B |
Enter prefix mode |
Ctrl+B " |
Split pane horizontally |
Ctrl+B % |
Split pane vertically |
Ctrl+B Arrow |
Navigate between panes |
Ctrl+B x |
Close active pane |
Ctrl+B c |
New tab |
Ctrl+B d |
Toggle diff viewer |
Ctrl+B t |
Open settings / themes |
Cmd+S / Ctrl+S |
Save current file |
Cmd+W / Ctrl+W |
Close current editor pane |
Cmd+1/2/3 |
Switch between editor tabs |
Prefix mode automatically resets after 2 seconds if no action key is pressed.
| Layer | Technology |
|---|---|
| Framework | Electron 40 |
| UI | React 19 + TypeScript |
| Terminal | xterm.js + node-pty |
| Layout | Allotment (resizable panes) |
| Editor | CodeMirror 6 |
| Git | simple-git + diff2html |
| Build | Electron Forge + Webpack |
| Icons | Lucide React |
You need Node.js (v18 or later) and npm installed on your machine.
git clone https://github.com/deandevz/KingIDE.git
cd KingIDE
npm installnpm startThis opens King IDE with hot reload enabled. Changes to the renderer code will refresh automatically.
npm run makeThis creates platform specific distributables in the out/ folder:
| Platform | Format |
|---|---|
| macOS | .zip |
| Windows | .exe (Squirrel) |
| Linux | .deb .rpm |
king_ide/
├── src/
│ ├── main/ # Electron main process
│ │ ├── index.ts # App entry and window creation
│ │ ├── terminal-manager.ts
│ │ └── ipc/ # IPC handlers (terminal, git, fs)
│ ├── preload/
│ │ └── index.ts # Secure context bridge
│ └── renderer/ # React UI
│ ├── App.tsx
│ ├── state/ # Context + reducer
│ ├── components/ # Terminal, Editor, Sidebar, DiffViewer, StatusBar
│ ├── hooks/ # useKeyBindings, useTerminalManager, useGitInfo
│ ├── themes/ # Theme definitions (7 built in themes)
│ ├── utils/ # Pane tree, terminal registry, editor registry
│ └── styles/ # CSS with custom properties
├── forge.config.ts # Electron Forge config
├── webpack.main.config.ts
├── webpack.renderer.config.ts
└── package.json
King IDE follows the standard Electron architecture with strict context isolation for security.
┌─────────────────────────────────────────────────┐
│ Main Process │
│ │
│ Terminal Manager (node-pty) │
│ Git Handlers (simple-git) │
│ File System Handlers │
└─────────────┬───────────────────────────────────┘
│ IPC (context bridge)
┌─────────────┴───────────────────────────────────┐
│ Renderer Process │
│ │
│ React App │
│ ├── AppContext (global state + reducer) │
│ ├── Terminal Area (xterm.js + pane tree) │
│ ├── Editor Area (CodeMirror 6 + split panes) │
│ ├── Sidebar (file explorer + git info) │
│ ├── Diff Viewer (diff2html) │
│ └── Status Bar │
└─────────────────────────────────────────────────┘
The renderer has zero direct access to Node.js. All system operations go through a preload bridge that exposes three APIs:
- terminalAPI for creating, writing, resizing, and killing terminal sessions
- gitAPI for fetching diffs, branches, and file status
- fsAPI for folder selection, directory reading, file read/write, and config persistence
- Theming system with multiple built in themes
- Terminal wallpaper with opacity, blur, and display mode
- Integrated text editor with syntax highlighting
- Custom app icon and KingIDE branding
- File operations (create, rename, delete) from the sidebar
- Search across files
- Git operations (stage, commit, push) from the UI
- Plugin system
- Rewrite in Tauri + Rust for native performance
This project is in its early MVP stage. If you have ideas or want to help, feel free to open an issue or submit a pull request.
- Fork the repository
- Create your feature branch (
git checkout -b feature/awesome) - Commit your changes (
git commit -m 'Add awesome feature') - Push to the branch (
git push origin feature/awesome) - Open a Pull Request
GPL-3.0 License. See LICENSE for details.
Built with caffeine and curiosity.