sdfx
The ultimate no-code platform to build and share AI apps with beautiful UI.
Stars: 213
SDFX is the ultimate no-code platform for building and sharing AI apps with beautiful UI. It enables the creation of user-friendly interfaces for complex workflows by combining Comfy workflow with a UI. The tool is designed to merge the benefits of form-based UI and graph-node based UI, allowing users to create intricate graphs with a high-level UI overlay. SDFX is fully compatible with ComfyUI, abstracting the need for installing ComfyUI. It offers features like animated graph navigation, node bookmarks, UI debugger, custom nodes manager, app and template export, image and mask editor, and more. The tool compiles as a native app or web app, making it easy to maintain and add new features.
README:
Features |
Screenshots |
SDFX App Guide |
Installation |
Run
The ultimate no-code platform to build and share AI apps with beautiful UI.
Join our Discord Server community for latest news, video tutorials and demo apps.
SDFX enables the creation of straightforward user interfaces for intricate workflows. An SDFX application combines a Comfy workflow with a user interface. The JSON that describes the workflow is enriched with extra meta information about the application and its author, as well as the association between UI components and node widgets.
Features
Screenshots
SDFX Application JSON Structure Guide
Installation
Run
Installation for users already using ComfyUI Locally
This project was originally created to meet the needs of users from A1111 (form based UI) and ComfyUI (graph-node based), which are two communities with differing visions. With SDFX, we aimed to merge the benefits of both worlds, without the drawbacks. What SDFX allows, for example, is the creation of complex graphs (as one would do on ComfyUI), but with an overlay of a simpler, high-level UI (such as a form-based interface, with an incredible UI). Thus, in theory, someone could recreate A1111 with SDFX and share the JSON online.
This is an initial draft, there is still much to do (mostly the App Creator that will be released soon). Some had lost faith in us, even calling us vaporware. The reality, as you will see by browsing the source code, is that SDFX required a considerable amount of work. It was made by a solo developer, and now the team is growing. We tried to do things right, focusing solely on what we do best: UIs and product design with a modern frontend stack. Therefore, we rely 100% on Comfy's backend, making SDFX fully compatible with ComfyUI. However, installing ComfyUI is not necessary, as everything is abstracted. We also made an effort to simplify the installation process; in most cases, you will only need to double-click on setup.bat / setup.sh and follow the wizard.
We hope you will like it, and it's with great pleasure that we share our vision and this repo with you, hoping it will pave the way for many contributions from you, to further the advancement of the open-source AI space.
- Build and share user-friendly apps on top of complex workflows
- 100% compatible with ComfyUI and all its features
- Can work with your existing Comfy installation (with our SDFXBridgeForComfy custom node)
- LiteGraph almost refactored from scratch in typescript
- Animated graph navigation
- Node bookmarks and advanced graph search
- Lightning fast UI instanciation and beautiful high-level components (450x faster than Gradio)
- UI Debugger (rudimentary for now)
- Native Custom Nodes Manager (thanks to Dr.Lt.Data)
- Export and share apps and templates (group nodes export soon)
- Advanced layer-based image and mask editor (WIP)
- Advanced checkpoint picker and gallery
- Advanced input image picker
- Modern and ultra fast frontend stack (vitejs, vuejs, electron)
- Compiles as a native app (Windows, Linux, Mac) or as a webapp
- Extremely easy to maintain and add new features
![]() |
![]() |
|---|
Welcome to the JSON structure guide for SDFX applications. The following is a comprehensive overview for developers looking to understand and utilize the JSON format for creating user-friendly UI with SDFX. Our aim is to ensure clarity and ease of use, so you can integrate and exchange SDFX apps with confidence.
{
"name": "SDFX Timeline SD15",
"meta": {},
"type": "sdfx",
"mapping": {
"leftpane": [],
"mainpane": [],
"rightpane": []
},
"version": 0.4,
"last_node_id": 287,
"last_link_id": 569,
"nodes": [],
"links": [],
"groups": [],
"config": {},
"extra": {}
}-
name: The name you assign to your application.
-
meta: This key houses essential details about your application, for instance:
- `version`: "0.4.1"
- `description`: "Timeline for SD15"
- `icon`: null (This should be updated with a link to a 512x512 image, or a base64 URL)
- `keywords`: "timeline, SD15, upscaler, LCM"
- `author`: "SDFX"
- `license`: "MIT"
- `url`: "https://sdfx.ai"-
type: Designated as"sdfx", this key identifies the app as an SDFX application while maintaining compatibility with ComfyUI. This means SDFX apps can be dragged and dropped onto ComfyUI and vice versa.
-
mapping: Specifies the UI structure. Within the mapping, you might find the following structure to describe a Tab component with a checkpoint loader, fully compatible with Tailwind CSS classes:
{
"label": "Generation",
"component": "Tab",
"class": "p-4 lg:p-8 xl:p-10 overflow-y-scroll",
"childrin": [
{
"component": "div",
"class": "flex justify-between space-x-4 lg:space-x-8",
"childrin": [
{
"label": "Section 1",
"class": "leftview w-80",
"component": "div",
"childrin": [
{
"label": "Checkpoint",
"showLabel": true,
"type": "control",
"component": "ModelPicker",
"target": {
"nodeId": 4,
"nodeType": "CheckpointLoaderSimple",
"widgetNames": ["ckpt_name"],
"widgetIdxs": [0]
}
}
]
}
]
}
]
}- The remaining keys are standard LiteGraph properties used to describe the workflow.
Developers can leverage a rich set of UI components for creating user interfaces. Here's a list of available components that can be used and customized with VueJS and Tailwind CSS:
ButtonDragNumberImageLoaderInputModelPickerNumberPreviewPromptPromptTimelineSelectorSliderTextAreaToggleBoxDimensionsBoxSeed
Additionally, HTML elements such as div, p, ul, li, img, iframe, video, and more can be used to enrich the user interface.
For layout and structural design, elements like SplitPane, SplitH, SplitV, Tab, TabBox, TabBar, and ToggleSettings offer further customization.
The ease of creating new components with VueJS and Tailwind CSS is unmatched, allowing for rapid development and high-quality user interface design. As SDFX moves towards an open-source release, this guide will be invaluable for developers anticipating to engage with a professional and user-centric platform.
Enjoy creating with SDFX, and let the simplicity and power of JSON structure enhance your application development process.
Note: Currently, the process of designing your SDFX application and mapping UI components to node parameters is manual. We understand the intricacies involved and are excited to announce that the release of the SDFX App Creator is on the horizon.
The SDFX App Creator will let you create your UI mapping by introducing a visual design interface with drag & drop capabilities. This will greatly simplify the process of linking UI controls with the corresponding node parameters in the workflow graph. Stay tuned for this feature.
Make sure your system meets the following requirements:
- Node.js version 18.9.1
- npm version 8.19.1
- Python 3.11
- Git
git clone https://github.com/sdfxai/sdfx.git
cd sdfxThen open setup.bat to install dependencies
Error says no Python, but it's installed?
A common mistake is forgetting to check the option to add Python to the PATH during installation, as it's often unchecked by default in the installer wizard. Make sure Python is added to your system's environment variables to run the script smoothly. git clone https://github.com/sdfxai/sdfx.git
cd sdfx
./setup.shClick to expand
To perform a manual installation, follow these steps:
-
Install Frontend Dependencies:
Navigate to the
srcdirectory of SDFX and install the npm dependencies:cd src npm install cd ..
-
Clone and Install ComfyUI:
Clone the ComfyUI repository into the root directory of SDFX from ComfyUI GitHub and follow the installation instructions provided in the readme to install ComfyUI dependencies.
-
Add the custom node SDFXBridgeForComfyUI
Follow the instructions on the repository of the custom node SDFXBridgeForComfyUI to add it to your ComfyUi custom_nodes folder.
-
Create Configuration File:
Create a file named
sdfx.config.jsonat the root of your project. Follow the instructions provided here to build the configuration file according to your requirements. -
Run
Start ComfyUI Then start SDFX with:
cd src npm run start
Click to expand
If you already have ComfyUI installed on your machine, follow these steps to integrate SDFX:
-
Clone the SDFXBridgeForComfyUI custom_node on your ComfyUI custom_node path:
git clone https://github.com/sdfxai/SDFXBridgeForComfyUI.git
-
For detailed instructions, please refer to the official SDFX for ComfyUI README.
-
Install front-end dependencies and run it:
cd src
npm install
npm run startLaunch SDFX app with run.bat (./run.sh for Linux/MacOs)
For Tasks:
Click tags to check more tools for each tasksFor Jobs:
Alternative AI tools for sdfx
Similar Open Source Tools
sdfx
SDFX is the ultimate no-code platform for building and sharing AI apps with beautiful UI. It enables the creation of user-friendly interfaces for complex workflows by combining Comfy workflow with a UI. The tool is designed to merge the benefits of form-based UI and graph-node based UI, allowing users to create intricate graphs with a high-level UI overlay. SDFX is fully compatible with ComfyUI, abstracting the need for installing ComfyUI. It offers features like animated graph navigation, node bookmarks, UI debugger, custom nodes manager, app and template export, image and mask editor, and more. The tool compiles as a native app or web app, making it easy to maintain and add new features.
lexido
Lexido is an innovative assistant for the Linux command line, designed to boost your productivity and efficiency. Powered by Gemini Pro 1.0 and utilizing the free API, Lexido offers smart suggestions for commands based on your prompts and importantly your current environment. Whether you're installing software, managing files, or configuring system settings, Lexido streamlines the process, making it faster and more intuitive.
steel-browser
Steel is an open-source browser API designed for AI agents and applications, simplifying the process of building live web agents and browser automation tools. It serves as a core building block for a production-ready, containerized browser sandbox with features like stealth capabilities, text-to-markdown session management, UI for session viewing/debugging, and full browser control through popular automation frameworks. Steel allows users to control, run, and manage a production-ready browser environment via a REST API, offering features such as full browser control, session management, proxy support, extension support, debugging tools, anti-detection mechanisms, resource management, and various browser tools. It aims to streamline complex browsing tasks programmatically, enabling users to focus on their AI applications while Steel handles the underlying complexity.
ai-artifacts
AI Artifacts is an open source tool that replicates Anthropic's Artifacts UI in the Claude chat app. It utilizes E2B's Code Interpreter SDK and Core SDK for secure AI code execution in a cloud sandbox environment. Users can run AI-generated code in various languages such as Python, JavaScript, R, and Nextjs apps. The tool also supports running AI-generated Python in Jupyter notebook, Next.js apps, and Streamlit apps. Additionally, it offers integration with Vercel AI SDK for tool calling and streaming responses from the model.
fragments
Fragments is an open-source tool that leverages Anthropic's Claude Artifacts, Vercel v0, and GPT Engineer. It is powered by E2B Sandbox SDK and Code Interpreter SDK, allowing secure execution of AI-generated code. The tool is based on Next.js 14, shadcn/ui, TailwindCSS, and Vercel AI SDK. Users can stream in the UI, install packages from npm and pip, and add custom stacks and LLM providers. Fragments enables users to build web apps with Python interpreter, Next.js, Vue.js, Streamlit, and Gradio, utilizing providers like OpenAI, Anthropic, Google AI, and more.
langserve
LangServe helps developers deploy `LangChain` runnables and chains as a REST API. This library is integrated with FastAPI and uses pydantic for data validation. In addition, it provides a client that can be used to call into runnables deployed on a server. A JavaScript client is available in LangChain.js.
odoo-expert
RAG-Powered Odoo Documentation Assistant is a comprehensive documentation processing and chat system that converts Odoo's documentation to a searchable knowledge base with an AI-powered chat interface. It supports multiple Odoo versions (16.0, 17.0, 18.0) and provides semantic search capabilities powered by OpenAI embeddings. The tool automates the conversion of RST to Markdown, offers real-time semantic search, context-aware AI-powered chat responses, and multi-version support. It includes a Streamlit-based web UI, REST API for programmatic access, and a CLI for document processing and chat. The system operates through a pipeline of data processing steps and an interface layer for UI and API access to the knowledge base.
LLamaWorker
LLamaWorker is a HTTP API server developed to provide an OpenAI-compatible API for integrating Large Language Models (LLM) into applications. It supports multi-model configuration, streaming responses, text embedding, chat templates, automatic model release, function calls, API key authentication, and test UI. Users can switch models, complete chats and prompts, manage chat history, and generate tokens through the test UI. Additionally, LLamaWorker offers a Vulkan compiled version for download and provides function call templates for testing. The tool supports various backends and provides API endpoints for chat completion, prompt completion, embeddings, model information, model configuration, and model switching. A Gradio UI demo is also available for testing.
bedrock-claude-chat
This repository is a sample chatbot using the Anthropic company's LLM Claude, one of the foundational models provided by Amazon Bedrock for generative AI. It allows users to have basic conversations with the chatbot, personalize it with their own instructions and external knowledge, and analyze usage for each user/bot on the administrator dashboard. The chatbot supports various languages, including English, Japanese, Korean, Chinese, French, German, and Spanish. Deployment is straightforward and can be done via the command line or by using AWS CDK. The architecture is built on AWS managed services, eliminating the need for infrastructure management and ensuring scalability, reliability, and security.
Fabric
Fabric is an open-source framework designed to augment humans using AI by organizing prompts by real-world tasks. It addresses the integration problem of AI by creating and organizing prompts for various tasks. Users can create, collect, and organize AI solutions in a single place for use in their favorite tools. Fabric also serves as a command-line interface for those focused on the terminal. It offers a wide range of features and capabilities, including support for multiple AI providers, internationalization, speech-to-text, AI reasoning, model management, web search, text-to-speech, desktop notifications, and more. The project aims to help humans flourish by leveraging AI technology to solve human problems and enhance creativity.
kwaak
Kwaak is a tool that allows users to run a team of autonomous AI agents locally from their own machine. It enables users to write code, improve test coverage, update documentation, and enhance code quality while focusing on building innovative projects. Kwaak is designed to run multiple agents in parallel, interact with codebases, answer questions about code, find examples, write and execute code, create pull requests, and more. It is free and open-source, allowing users to bring their own API keys or models via Ollama. Kwaak is part of the bosun.ai project, aiming to be a platform for autonomous code improvement.
cursor-tools
cursor-tools is a CLI tool designed to enhance AI agents with advanced skills, such as web search, repository context, documentation generation, GitHub integration, Xcode tools, and browser automation. It provides features like Perplexity for web search, Gemini 2.0 for codebase context, and Stagehand for browser operations. The tool requires API keys for Perplexity AI and Google Gemini, and supports global installation for system-wide access. It offers various commands for different tasks and integrates with Cursor Composer for AI agent usage.
simpleAI
SimpleAI is a self-hosted alternative to the not-so-open AI API, focused on replicating main endpoints for LLM such as text completion, chat, edits, and embeddings. It allows quick experimentation with different models, creating benchmarks, and handling specific use cases without relying on external services. Users can integrate and declare models through gRPC, query endpoints using Swagger UI or API, and resolve common issues like CORS with FastAPI middleware. The project is open for contributions and welcomes PRs, issues, documentation, and more.
supabase-mcp
Supabase MCP Server standardizes how Large Language Models (LLMs) interact with Supabase, enabling AI assistants to manage tables, fetch config, and query data. It provides tools for project management, database operations, project configuration, branching (experimental), and development tools. The server is pre-1.0, so expect some breaking changes between versions.
code2prompt
Code2Prompt is a powerful command-line tool that generates comprehensive prompts from codebases, designed to streamline interactions between developers and Large Language Models (LLMs) for code analysis, documentation, and improvement tasks. It bridges the gap between codebases and LLMs by converting projects into AI-friendly prompts, enabling users to leverage AI for various software development tasks. The tool offers features like holistic codebase representation, intelligent source tree generation, customizable prompt templates, smart token management, Gitignore integration, flexible file handling, clipboard-ready output, multiple output options, and enhanced code readability.
gitingest
GitIngest is a tool that allows users to turn any Git repository into a prompt-friendly text ingest for LLMs. It provides easy code context by generating a text digest from a git repository URL or directory. The tool offers smart formatting for optimized output format for LLM prompts and provides statistics about file and directory structure, size of the extract, and token count. GitIngest can be used as a CLI tool on Linux and as a Python package for code integration. The tool is built using Tailwind CSS for frontend, FastAPI for backend framework, tiktoken for token estimation, and apianalytics.dev for simple analytics. Users can self-host GitIngest by building the Docker image and running the container. Contributions to the project are welcome, and the tool aims to be beginner-friendly for first-time contributors with a simple Python and HTML codebase.
For similar tasks
dify
Dify is an open-source LLM app development platform that combines AI workflow, RAG pipeline, agent capabilities, model management, observability features, and more. It allows users to quickly go from prototype to production. Key features include: 1. Workflow: Build and test powerful AI workflows on a visual canvas. 2. Comprehensive model support: Seamless integration with hundreds of proprietary / open-source LLMs from dozens of inference providers and self-hosted solutions. 3. Prompt IDE: Intuitive interface for crafting prompts, comparing model performance, and adding additional features. 4. RAG Pipeline: Extensive RAG capabilities that cover everything from document ingestion to retrieval. 5. Agent capabilities: Define agents based on LLM Function Calling or ReAct, and add pre-built or custom tools. 6. LLMOps: Monitor and analyze application logs and performance over time. 7. Backend-as-a-Service: All of Dify's offerings come with corresponding APIs for easy integration into your own business logic.
intro-to-intelligent-apps
This repository introduces and helps organizations get started with building AI Apps and incorporating Large Language Models (LLMs) into them. The workshop covers topics such as prompt engineering, AI orchestration, and deploying AI apps. Participants will learn how to use Azure OpenAI, Langchain/ Semantic Kernel, Qdrant, and Azure AI Search to build intelligent applications.
runhouse
Runhouse is a tool that allows you to build, run, and deploy production-quality AI apps and workflows on your own compute. It provides simple, powerful APIs for the full lifecycle of AI development, from research to evaluation to production to updates to scaling to management, and across any infra. By automatically packaging your apps into scalable, secure, and observable services, Runhouse can also turn otherwise redundant AI activities into common reusable components across your team or company, which improves cost, velocity, and reproducibility.
Awesome-LLM-RAG-Application
Awesome-LLM-RAG-Application is a repository that provides resources and information about applications based on Large Language Models (LLM) with Retrieval-Augmented Generation (RAG) pattern. It includes a survey paper, GitHub repo, and guides on advanced RAG techniques. The repository covers various aspects of RAG, including academic papers, evaluation benchmarks, downstream tasks, tools, and technologies. It also explores different frameworks, preprocessing tools, routing mechanisms, evaluation frameworks, embeddings, security guardrails, prompting tools, SQL enhancements, LLM deployment, observability tools, and more. The repository aims to offer comprehensive knowledge on RAG for readers interested in exploring and implementing LLM-based systems and products.
sdfx
SDFX is the ultimate no-code platform for building and sharing AI apps with beautiful UI. It enables the creation of user-friendly interfaces for complex workflows by combining Comfy workflow with a UI. The tool is designed to merge the benefits of form-based UI and graph-node based UI, allowing users to create intricate graphs with a high-level UI overlay. SDFX is fully compatible with ComfyUI, abstracting the need for installing ComfyUI. It offers features like animated graph navigation, node bookmarks, UI debugger, custom nodes manager, app and template export, image and mask editor, and more. The tool compiles as a native app or web app, making it easy to maintain and add new features.
Build-Modern-AI-Apps
This repository serves as a hub for Microsoft Official Build & Modernize AI Applications reference solutions and content. It provides access to projects demonstrating how to build Generative AI applications using Azure services like Azure OpenAI, Azure Container Apps, Azure Kubernetes, and Azure Cosmos DB. The solutions include Vector Search & AI Assistant, Real-Time Payment and Transaction Processing, and Medical Claims Processing. Additionally, there are workshops like the Intelligent App Workshop for Microsoft Copilot Stack, focusing on infusing intelligence into traditional software systems using foundation models and design thinking.
RAG_Hack
RAGHack is a hackathon focused on building AI applications using the power of RAG (Retrieval Augmented Generation). RAG combines large language models with search engine knowledge to provide contextually relevant answers. Participants can learn to build RAG apps on Azure AI using various languages and retrievers, explore frameworks like LangChain and Semantic Kernel, and leverage technologies such as agents and vision models. The hackathon features live streams, hack submissions, and prizes for innovative projects.
generative-ai-with-javascript
The 'Generative AI with JavaScript' repository is a comprehensive resource hub for JavaScript developers interested in delving into the world of Generative AI. It provides code samples, tutorials, and resources from a video series, offering best practices and tips to enhance AI skills. The repository covers the basics of generative AI, guides on building AI applications using JavaScript, from local development to deployment on Azure, and scaling AI models. It is a living repository with continuous updates, making it a valuable resource for both beginners and experienced developers looking to explore AI with JavaScript.
For similar jobs
Protofy
Protofy is a full-stack, batteries-included low-code enabled web/app and IoT system with an API system and real-time messaging. It is based on Protofy (protoflow + visualui + protolib + protodevices) + Expo + Next.js + Tamagui + Solito + Express + Aedes + Redbird + Many other amazing packages. Protofy can be used to fast prototype Apps, webs, IoT systems, automations, or APIs. It is a ultra-extensible CMS with supercharged capabilities, mobile support, and IoT support (esp32 thanks to esphome).
react-native-vision-camera
VisionCamera is a powerful, high-performance Camera library for React Native. It features Photo and Video capture, QR/Barcode scanner, Customizable devices and multi-cameras ("fish-eye" zoom), Customizable resolutions and aspect-ratios (4k/8k images), Customizable FPS (30..240 FPS), Frame Processors (JS worklets to run facial recognition, AI object detection, realtime video chats, ...), Smooth zooming (Reanimated), Fast pause and resume, HDR & Night modes, Custom C++/GPU accelerated video pipeline (OpenGL).
dev-conf-replay
This repository contains information about various IT seminars and developer conferences in South Korea, allowing users to watch replays of past events. It covers a wide range of topics such as AI, big data, cloud, infrastructure, devops, blockchain, mobility, games, security, mobile development, frontend, programming languages, open source, education, and community events. Users can explore upcoming and past events, view related YouTube channels, and access additional resources like free programming ebooks and data structures and algorithms tutorials.
OpenDevin
OpenDevin is an open-source project aiming to replicate Devin, an autonomous AI software engineer capable of executing complex engineering tasks and collaborating actively with users on software development projects. The project aspires to enhance and innovate upon Devin through the power of the open-source community. Users can contribute to the project by developing core functionalities, frontend interface, or sandboxing solutions, participating in research and evaluation of LLMs in software engineering, and providing feedback and testing on the OpenDevin toolset.
polyfire-js
Polyfire is an all-in-one managed backend for AI apps that allows users to build AI applications directly from the frontend, eliminating the need for a separate backend. It simplifies the process by providing most backend services in just a few lines of code. With Polyfire, users can easily create chatbots, transcribe audio files, generate simple text, manage long-term memory, and generate images. The tool also offers starter guides and tutorials to help users get started quickly and efficiently.
sdfx
SDFX is the ultimate no-code platform for building and sharing AI apps with beautiful UI. It enables the creation of user-friendly interfaces for complex workflows by combining Comfy workflow with a UI. The tool is designed to merge the benefits of form-based UI and graph-node based UI, allowing users to create intricate graphs with a high-level UI overlay. SDFX is fully compatible with ComfyUI, abstracting the need for installing ComfyUI. It offers features like animated graph navigation, node bookmarks, UI debugger, custom nodes manager, app and template export, image and mask editor, and more. The tool compiles as a native app or web app, making it easy to maintain and add new features.
aimeos-laravel
Aimeos Laravel is a professional, full-featured, and ultra-fast Laravel ecommerce package that can be easily integrated into existing Laravel applications. It offers a wide range of features including multi-vendor, multi-channel, and multi-warehouse support, fast performance, support for various product types, subscriptions with recurring payments, multiple payment gateways, full RTL support, flexible pricing options, admin backend, REST and GraphQL APIs, modular structure, SEO optimization, multi-language support, AI-based text translation, mobile optimization, and high-quality source code. The package is highly configurable and extensible, making it suitable for e-commerce SaaS solutions, marketplaces, and online shops with millions of vendors.
llm-ui
llm-ui is a React library designed for LLMs, providing features such as removing broken markdown syntax, adding custom components to LLM output, smoothing out pauses in streamed output, rendering at native frame rate, supporting code blocks for every language with Shiki, and being headless to allow for custom styles. The library aims to enhance the user experience and flexibility when working with LLMs.








