Integrating your Draggen.io moodboards into ComfyUI allows you to use your visual compositions as structured inputs for advanced Stable Diffusion workflows. By leveraging Draggen's API, you can fetch element coordinates, text metadata, and image assets to drive complex node-based generations. This tutorial covers how to authenticate your account and connect your canvas data to external AI tools.
Step 1: Install the Draggen nodes in ComfyUI
The easiest way to install the ComfyUI nodes for Draggen is through the ComfyUI manager. Simply search for "Draggen" and install the official nodes. Alternatively, Draggen provides a dedicated bridge for ComfyUI users via the Integrations page. To find it, return to your Dashboard and navigate to the Integrations tab (or go directly to /integrations). Locate the card labeled ComfyUI Integration.
Clicking this card will direct you to the official GitHub repository containing the custom Draggen nodes for ComfyUI. Follow the installation instructions in the repository to add the nodes to your local ComfyUI instance. These nodes are designed to parse the data.json structure exported by Draggen, which includes the position, size, and zIndex of every element on your canvas.
![[The Integrations page in Draggen highlighting the ComfyUI card and the external link icon]](https://storage.googleapis.com/canvas-ai-production-uploads/tutorials/how-to-use-draggen-moodboards-in-comfyui/img-0-1772560258106.png)
Step 2: Generate an API Key
Once the custom nodes are installed in ComfyUI, we need to allow ComfyUI to communicate with your Draggen account. To do this you must first create a secure Bearer token. Navigate to the Dashboard and click on Integrations. Scroll down to the API Keys section and click the Create API Key button.
When the dialog appears, enter a descriptive name like "ComfyUI Integration" and select the appropriate scope, such as "Read boards." After you click Create API Key, your secret key (which begins with dk_) will be displayed. Be sure to copy this immediately, as the secret is only shown once for security purposes.
![[The API Keys section in the Account settings showing the Create API Key button and a generated dk_ token]](https://storage.googleapis.com/canvas-ai-production-uploads/tutorials/how-to-use-draggen-moodboards-in-comfyui/img-1-1772560303598.png)
Step 3: Locate your Board ID
ComfyUI needs to know exactly which moodboard to pull data from. Each board has a unique identifier that can be found in two ways. The simplest method is to open your board in the Draggen editor and look at the browser address bar; the Board ID is the alphanumeric string following the final slash in the URL.
Note: The remote loader is only available for paid tiers. Free tiers can instead export their boards as Zip file and load them in ComfyUI using the Local Loader node.
Step 4: Configure the Draggen Node in ComfyUI
Right-click the workspace and search for "Draggen" to add the fetcher node. In the node settings, paste your dk_ API key into the authentication field and enter the Board ID you identified in Step 3.
When you execute the queue, the node will fetch your canvas data. This includes raw image URLs from the CDN, text strings from your Text elements, and even the coordinates of your Box elements, which can be used as latent masks or area prompts. If you make changes to your moodboard in Draggen, the Auto-Save feature ensures that the next time you trigger the ComfyUI node, the updated layout is pulled automatically.
Tips
- Use Board Data for Precision: If you prefer to work offline, use the Quick Actions Panel on your canvas to select Export Board Data (ZIP). You can then point your ComfyUI nodes to the local
data.jsonfile. - Tier Benefits: If you are a Creator tier user, you can use the Obsidian Vault Sync to keep your design notes and ComfyUI prompts aligned across your knowledge base.
- Organize with Layers: Use the Bring to Front or Send to Back tools in Draggen to organize your elements. The ComfyUI nodes often use the zIndex property to determine the stacking order of masks.
- Keyboard Navigation: While prepping your board for export, use I to quickly add images and Shift + Drag to use Snap Guides for perfect alignment before sending the data to ComfyUI.
Conclusion
By connecting Draggen to ComfyUI, you’ve turned your moodboard from a simple visual reference into a functional blueprint for AI generation. You learned how to generate a secure API Key, identify your Board ID, and use the Integrations page to bridge the gap between your canvas and your local ComfyUI nodes. This workflow allows for a highly controlled design process, where the placement of every box and image on your Draggen canvas directly influences the final output of your Stable Diffusion generations.