ViewComfy is an open source tool to help you create beautiful web apps from ComfyUI workflows.
It can support image, video and text outputs and is optimised to work well on desktop and mobile.
Install Node.js 18.18 or later (recommended v20.17)
Clone the repo
git clone https://github.com/ViewComfy/ViewComfy.gitInstall dependencies and start the dev server
cd ViewComfy
npm install
npm run devFor a more detailed guide on how to set up ViewMode and share your app with ngrok you can refer to our blog: https://www.viewcomfy.com/blog/turn-a-comfyui-workflow-into-an-app
You can drag and drop your ComfyUI workflow_api.json file into the form editor. It will then generate a new form that you can use to configure the inputs that will be displayed on the playground.
The Playground is a simplified UI where you can run your workflows. It can easily be turned into a sharable web app using a service like ngrok or ViewComfy cloud.
ViewMode will only load the playground page and can easily be turned into a web app. This is convenient if you want to share your workflow with someone without sharing the workflow_api.json, and without them having to install ComfyUI.
To use ViewMode you need to download the view_comfy.json that is generated when you use the form editor and place it in the root of the project along with the workflow_api.json.
To enable ViewMode, edit the .env file in the root of the project:
.env file ->
NEXT_PUBLIC_VIEW_MODE="true"
npm run devViewComfy by default will look for a file called view_comfy.json in the project's root folder to render the web app. You can use the VIEW_COMFY_FILE_NAME environment variable to point to a different file.
.env file ->
VIEW_COMFY_FILE_NAME="view_comfy.json"
NEXT_PUBLIC_VIEW_MODE="true"
npm run deve.g with the command line:
VIEW_COMFY_FILE_NAME="view_comfy.json" NEXT_PUBLIC_VIEW_MODE="true" npm run devYou can also drop a view_comfy.json directly in the form editor to edit it without needing the workflow_api.json.
Feel free to contribute with feedback, suggestions, issues or pull requests.
ViewComfy is a Next.js app - Next.js Documentation
If you need to deploy a ViewComfy app or a ComfyUI workflow, you can do it directly on our website.