MCPcopy Index your code
hub / github.com/cosmicbuffalo/comfyui-mobile-frontend

github.com/cosmicbuffalo/comfyui-mobile-frontend @v3.0.2

Chat with this repo
repository ↗ · DeepWiki ↗ · release v3.0.2 ↗ · + Follow
2,266 symbols 5,620 edges 495 files 96 documented · 4%
What it actually does AI analysis from the code graph — generated when you open this
loading…
README

ComfyUI Mobile Frontend

An experimental dedicated mobile-first frontend for ComfyUI.

[!WARNING] This project was almost entirely vibecoded with claude code, codex and gemini cli. It is still a work in progress, and currently doesn't support all custom nodes automatically. Don't be surprised if it breaks!

Introduction

This project operates as a ComfyUI Custom Node that serves a modern mobile user interface. It is designed to make using ComfyUI easy and accessible from your phone or tablet.

Since the original goal of making generation accessible at all on mobile was achieved, the project has turned in a more ambitious direction - Why stop at just making ComfyUI baseline functional on mobile? The mobile interface should be able to completely replace the desktop graph-interface for ComfyUI!

Why?

Look, I like ComfyUI. It is a great tool and without it I probably wouldn't have gotten into AI in the first place. But man, is it a pain in the ass to use! (IMO)

I can see why some people like the graph interface. It's cool to see a solid workflow and the masterful craft that goes into making its graph look like a work of art. But I don't really give a shit about that most of the time. Most of the time, I just want to get from point A to point B and iterate repeatedly, and in cases like that the graph usually just gets in the way. try to scroll, oops now I'm zoomed way in or out. try to pan and oops, I just dragged this random node out of its position into a mess of other nodes. Maybe the graph interface is user friendly to some, but it sure ain't to me.

I just want to scroll through a workflow and easily and intuitively get to where I'm trying to go, change the thing I want to change, hit enqueue again, and then think about what to iterate on next. I want to be able to look at my outputs and see what settings I tweaked on them with a glance, and pull them right back into my workflow if needed. I want the feedback loop between iterations to be as fast and frictionless as possible.

So this mobile frontend is my attempt at improving upon the user experience of ComfyUI for myself and anyone else who agrees with me that the desktop interface is not their cup of tea. Let's make AI even more accessible now, shall we?

Features

☑️ Mobile-Optimized Interface: A responsive UI designed specifically for touch devices

  • tap, scroll, and swipe to navigate your mobile ComfyUI workspace
    • v3.0.0 introduces some improvements for desktop support as well, but desktop support still has a ways to go

☑️ Workflow Editor: Browse, fold, and edit nodes groups, and subgraphs

  • load and save workflows from anywhere, whether on your server, pasted from your clipboard, or out of a generated image
  • keep multiple workflow tabs open at once and switch between them without losing state
  • add or delete nodes, and edit connections directly from the mobile UI
  • navigate by traversing connections between nodes and jumping to bookmarks
  • easily hide parts of your workflow you don't need to see
  • reposition nodes, groups, and subgraphs in the mobile layout with drag-and-drop
  • drill into subgraphs from a placeholder node and edit inner nodes with a breadcrumb navigation bar
  • widget controls on subgraph placeholder nodes (promoted and proxy widgets rendered and editable inline)
  • organize your saved workflows into folders, and bookmark or hide them to cut the clutter

☑️ Workflow Runner: Trigger generations and monitor progress through your queue

  • WebSocket integration for live status and progress monitoring.
  • Follow the queue to take your hands off the wheel or focus on quickly iterating on a pinned widget
  • infinite-generation mode that auto-queues the next run (per-workflow, with a safety stop for fixed-seed loops)
  • automatic reconnect when the backend drops, plus recovery of jobs lost to a ComfyUI restart
  • scroll through generation history and load or copy workflows of anything you want to iterate on

☑️ Media Viewer: Full-screen viewer with convenient controls and familar gesture support

  • support for images and videos
  • inspect image metadata (just a few core attributes for now)
  • mark outputs as favorites so you can find them with filters later
  • download outputs directly to your device with one click
  • Load workflows from images, or pull images directly into workflows as inputs, hassle-free

☑️ Outputs/Inputs Browser: Inspect your server's outputs and inputs folders

  • search/filter/sort your outputs or inputs — including search by the prompt baked into an image
  • perform bulk operations like moves, deletes, and downloads (range-select a whole run at once)
  • download outputs to your device (iOS share sheet for saving to Photos/Files)
  • add files to favorites for quick access later

☑️ LoraManager Support: First-class support for LoraManager nodes and websocket integration

  • a rich model/LoRA picker with thumbnails, version, and base-model badges (works with or without LoRA Manager)

☑️ Custom Nodes Manager: Browse, install, update, enable/disable, and uninstall custom nodes from the app

☑️ Dark Theme: A slate/cyan dark UI tuned for mobile

Planned Features

  • [ ] Better Custom Node Support
  • [ ] Expanded Workflow Editing Capabilities
  • [x] delete nodes from a workflow
  • [x] create new nodes in a workflow (via fuzzy search)
  • [x] move nodes in/out of groups/subgraphs
  • [x] modify connections between nodes
  • [x] navigate into and edit subgraph inner nodes
  • [x] load multiple workflows at once (workflow tabs)
  • [ ] full subgraph creation and editing support
  • [x] ComfyUI Manager support (custom nodes manager)
  • [ ] Auto-positioning of nodes/Compatibility with desktop FE's graph interface
  • [x] Integration of Civitai model metadata
  • [ ] Integration of Huggingface model metadata
  • [ ] Security/Multi-User Mode (manual opt-in)
  • [ ] Enable multiple users with separate workflows/models/inputs/outputs
  • [ ] Password authentication
  • [ ] Admin interface for user/model/resource management
  • [ ] Parental controls
  • [ ] Keyword/whitelist/blacklist based rule management

Screenshots

Workflow Panel

Workflow Panel Multiple Tabs Confirmation Dialog
Bookmarks + Pins Pinned Widget Editor Model Picker + Connections
Node Menu Workflow Actions
Responsive Behavior for Desktop (WIP)

Queue Panel & Media Viewer

Full-Screen Viewer Queue Item Menu Queue Panel Menu
Prompt Preview/Diff Re-enqueue

App Menu & Settings

Main Menu Preferences Feedback Form
Custom Nodes Manager

Inputs / Outputs Panel

Inputs / Outputs Panel Multiple Tabs Panel Menu
Filter + Sort Select Mode Selection Menu
Move Menu
Responsive Behavior for Desktop (WIP)

Installation

This project is installed as a standard ComfyUI Custom Node. Search for it in the ComfyUI-Manager by name (ensure author is cosmicbuffalo) or follow the steps below for a manual installation:

  1. Navigate to your ComfyUI custom_nodes directory: bash cd /path/to/ComfyUI/custom_nodes/
  2. Clone this repository: bash git clone https://github.com/cosmicbuffalo/comfyui-mobile-frontend.git
  3. Restart ComfyUI.

Usage

Once installed and ComfyUI is running, you can access the mobile interface by navigating to:

http://<your-comfyui-ip>:8188/mobile

Note: Replace <your-comfyui-ip> with the actual IP address of your computer if accessing from a mobile device on the same network. The build output is served from dist/ at /mobile (or /mobile/index.html).

[!IMPORTANT] Don't forget to add the --listen flag to your ComfyUI startup command to make your ComfyUI instance accessible to other devices on your LAN

LoRA Manager UI Integration

This mobile frontend supports LoRA Manager nodes and websocket integration.

Extension points exported contracts — how you extend this code

WorkflowFavoritesState (Interface)
* Device-local favorites for saved workflows and folders, keyed by the path * relative to the workflows dir (e.g. "foo.
src/hooks/useWorkflowFavorites.ts
CustomNodesManagerModalProps (Interface)
(no doc)
src/components/CustomNodesManagerModal.tsx
DiffSegment (Interface)
(no doc)
src/utils/workflowDiff.ts
CustomNodePackageMetadata (Interface)
(no doc)
src/api/customNodesManagerClient.ts
TemplateFavoritesState (Interface)
* Device-local favorites for workflow templates, keyed by "moduleName/templateName" * (a template is only unique within
src/hooks/useTemplateFavorites.ts
FoldIconProps (Interface)
(no doc)
src/components/FoldIcon.tsx
QueuePromptEntry (Interface)
(no doc)
src/utils/workflowDiff.ts
CustomNodeListResponse (Interface)
(no doc)
src/api/customNodesManagerClient.ts

Core symbols most depended-on inside this repo

makeLocationPointer
called by 162
src/utils/mobileLayout.ts
render
called by 99
src/components/AppMenu/MenuServerSection.tsx
getGroupKey
called by 68
src/utils/mobileLayout.ts
requireHierarchicalKey
called by 32
src/utils/itemKeys.ts
getWidgetIndexForInput
called by 24
src/utils/seedUtils.ts
list_files
called by 23
file_utils.py
hexToRgba
called by 22
src/utils/grouping.ts
getWidgetValue
called by 21
src/utils/workflowInputs.ts

Shape

Function 1,905
Interface 298
Method 43
Class 20

Languages

TypeScript86%
Python14%

Modules by API surface

src/hooks/useWorkflow.ts56 symbols
src/components/OutputsPanel.tsx56 symbols
__init__.py55 symbols
src/utils/workflowHierarchy.ts48 symbols
src/utils/mobileLayout.ts42 symbols
tests/test_file_utils.py38 symbols
src/components/modals/ConnectionModal.tsx30 symbols
model_metadata.py30 symbols
src/hooks/useLoraManager.ts28 symbols
src/components/WorkflowPanel/NodeCard/Parameters.tsx28 symbols
src/utils/workflowInputs.ts27 symbols
tests/test_mobile_app_push.py23 symbols

For agents

$ claude mcp add comfyui-mobile-frontend \
  -- python -m otcore.mcp_server <graph>

⬇ download graph artifact

Ask about this repo answers extend the page