English | 한국어 | 日本語 | 简体中文

Comfy Mobile UI

showcase.mp4

Mobile-first, node-style web interface for ComfyUI

Key Features | Installation Guide | Contributing | Show Your Support

---

📖 Introduction

Comfy Mobile UI is a mobile-first web interface designed to seamlessly handle node-based AI workflows on mobile devices, originally optimized for PC environments.

This is not just a simple viewer. Modify complex workflows on the go, add new nodes, manage models, and monitor execution status in real-time. Experience a desktop-like environment on your mobile device with a touch-optimized UX.

---

✨ Key Features

1. Multi-Mode Support

Provides both a powerful Graph View for freeform workflow editing and a Stack View for intuitivel modifying widget values by grouping nodes by type.

2. Touch-First UX

Perfectly reimagines complex desktop editing experiences for mobile gestures. Control intricate node graphs with ease using just your fingers.

• Radial Menu: Quickly access node addition, removal, color change, and execution mode (Always, Mute, Bypass) with a single long-press.
• Advanced Widget Editor: Comfortably edit node widgets in a dedicated large modal. Easily import images and videos from your device's album or the generated gallery.
• Precision Linking: Precisely configure connection lines between nodes using an intuitive drag-and-drop interface specifically designed for smaller screens.

3. Execution & Monitoring

Provides powerful tools to track execution status in real-time and manage the queue.

• Live Progress: Visually monitor the current executing node and overall progress in real-time.
• Server Console: Monitor server execution logs in real-time to check the overall system status.

4. Easy Resource Downloader

Install required models directly via URL without needing to access the server manually.

• Remote Download: Directly download Checkpoints, LoRAs, etc., to the server using model links from Hugging Face, Civitai, and more.
• Target Folder Selection: Directly specify the target folder for downloads to systematically manage resources by model type.

5. Unified Media Library

Instantly view and manage generated images and videos (MP4) within the app without needing a separate gallery.

• In-App Gallery: Offers smooth playback and viewing for everything from high-fidelity outputs to video previews.
• Seamless Export: Check outputs instantly and save them to local storage or share them externally.

6. Advanced Utilities

Provides smart tools to make workflow editing and management even more efficient.

• Workflow Snapshots: Save the current state of your workflow as a snapshot and restore it at any time. Ideal for fearless experimentation with parameters.
• Embedded Group Control: Built-in Fast Group Muter/Bypasser (from rgthree) to bulk control execution modes (Always, Mute, Bypass) of all nodes within a group.
• Trigger Word Manager: Save and manage trigger words for each LoRA in the Model Browser. Quickly lookup and copy keywords while editing workflows.
• Advanced Video Downloader: Use yt-dlp to download videos from various platforms directly to the server's input folder.
• Workflow Chain (Experimental): Link multiple independent workflows together. Automatically transfer output from one workflow to the input of the next for complex, sequential automation.

---

🛠️ Installation & Setup

1. Standard Installation (Recommended)

The easiest way to get started is to download a pre-built release:

1. Download: Go to Latest Release and download comfy-mobile-ui-api-extension-vX.X.X.zip.
2. Extract: Unzip the file on your computer.
3. Deploy: Copy the extracted comfy-mobile-ui-api-extension folder into your ComfyUI custom_nodes/ directory.
   • Step 3.5 (Portable User): If you are using the ComfyUI Windows Portable version without ComfyUI-Manager, run install-requirements-for-comfyui-portable.bat inside the extension folder to install required libraries.
4. Restart: Start (or restart) ComfyUI with the required flag:

   python main.py --enable-cors-header

5. Access: Open your browser and navigate to http://your-server-ip:9188 (or http://localhost:9188 if running locally). See the Connection Guide for more details.

2. Development / Manual Setup

If you want to contribute or build from source:

Prerequisites

• Node.js 18+ and npm
• Running ComfyUI server (typically http://localhost:8188)

Manual Extension Setup

1. Clone the repository:

   git clone https://github.com/jaeone94/comfy-mobile-ui.git
   cd comfy-mobile-ui

2. Copy API Extension:

   # Copy the extension folder to your ComfyUI custom_nodes directory
   cp -r comfy-mobile-ui-api-extension /path/to/your/comfyui/custom_nodes/

Running Development Server

# Install dependencies
npm install

# Start development server
npm run dev

# Open in browser: http://localhost:5173

Production Build

# Build for production
npm run build

# Preview production build
npm run preview

# Lint code
npm run lint

Manual Setup Checklist

Check the following for your ComfyUI installation:

1. API Extension Installed: comfy-mobile-ui-api-extension copied to custom_nodes/
2. CORS Enabled: Started with the --enable-cors-header flag
3. Network Access: Use --listen 0.0.0.0 for external network access (optional)

# Example ComfyUI start command
python main.py --enable-cors-header --listen 0.0.0.0

---

🤝 Contributing

Contributions are always welcome!

Code Quality Notice

Much of this app was developed using "vibe coding," so code quality may vary. We appreciate your understanding and welcome improvements!

How to Contribute

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

---

⭐ Show Your Support

⭐ If you find this app useful, please consider giving it a star! ⭐

Your support helps the project grow and motivates continued development.

---