> ## Documentation Index
> Fetch the complete documentation index at: https://comfyuiwiki.com/llms.txt
> Use this file to discover all available pages before exploring further.

# ComfyUI Official Documentation

> ComfyUI Official Documentation

<div className="relative">
  <div className="w-full text-center mt-16 pb-8">
    <div className="mt-24 text-center">
      <img src="https://mintcdn.com/comfyuiwikicom/wQRHATP5k3brbzHr/logo/light.svg?fit=max&auto=format&n=wQRHATP5k3brbzHr&q=85&s=2361696e67366045415df1027db148ae" className="block dark:hidden pointer-events-none mx-auto" width="204" height="57" data-path="logo/light.svg" />

      <img src="https://mintcdn.com/comfyuiwikicom/wQRHATP5k3brbzHr/logo/dark.svg?fit=max&auto=format&n=wQRHATP5k3brbzHr&q=85&s=5e79643c09d758904adb3f1e3b23705b" className="hidden dark:block pointer-events-none mx-auto" width="204" height="57" data-path="logo/dark.svg" />
    </div>

    <div className="flex justify-center w-full">
      <h1
        style={{
    fontSize: "18px",
    fontWeight: "bold",
    marginTop: "10px",
    textAlign: "center"
  }}
        className="text-center"
      >
        ComfyUI Official Documentation
      </h1>
    </div>
  </div>

  {/* social start */}

  <div className="pb-8 text-center">
    <div className="flex items-center justify-center gap-4">
      <a href="https://github.com/Comfy-Org/ComfyUI/" target="_blank" className="hover:opacity-80">
        <Icon icon="github" iconType="solid" size={32} />
      </a>

      <a href="https://x.com/ComfyUI" target="_blank" className="hover:opacity-80">
        <Icon icon="x-twitter" iconType="solid" size={32} />
      </a>

      <a href="https://discord.com/invite/comfyorg" target="_blank" className="hover:opacity-80">
        <Icon icon="discord" iconType="solid" size={32} />
      </a>

      <a href="https://www.youtube.com/@comfyorg" target="_blank" className="hover:opacity-80">
        <Icon icon="youtube" iconType="solid" size={32} />
      </a>
    </div>
  </div>

  {/* CAT ad: comfyuiwiki → missavdh.com funnel. Tracks via incoming-visits-logger (ref + via + utm_*). See CAT_AD_DESIGN.md. */}

  <a href="https://missavdh.com/?ref=comfyuiwiki&via=cat-ad-hero&utm_source=comfyuiwiki.com&utm_medium=docs-cat&utm_campaign=comfyui-funnel&from=index-hero" target="_blank" rel="noopener noreferrer" className="group relative mx-auto my-12 block max-w-5xl overflow-hidden rounded-3xl bg-gradient-to-br from-[#49378B] via-[#7c3aed] to-[#ec4899] text-white no-underline shadow-2xl ring-1 ring-white/30 transition-all duration-300 hover:scale-[1.01] hover:shadow-[0_25px_60px_-15px_rgba(236,72,153,0.6)] focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-[#7c3aed] focus:outline-none" aria-label="Open the live preview catalog — 7 preview thumbnails, external link to missavdh.com, 18+ only">
    <div className="pointer-events-none absolute inset-0 bg-gradient-to-t from-black/30 via-transparent to-white/10" aria-hidden="true" />

    <div className="relative p-6 sm:p-8">
      <div className="mb-6 flex h-44 items-end justify-center gap-2 sm:mb-8 sm:h-60 sm:gap-3" aria-hidden="true">
        <img src="https://mintcdn.com/comfyuiwikicom/jBy8uThZJ6MD6qYM/images/cat-ad/1.jpg?fit=max&auto=format&n=jBy8uThZJ6MD6qYM&q=85&s=d37ed307acdbc14192592dde26b51ab1" alt="" loading="lazy" className="h-32 w-24 rounded-xl object-cover shadow-xl ring-2 ring-white/40 transition-transform duration-300 group-hover:scale-110 sm:h-40 sm:w-28" style={{ transform: 'rotate(-6deg)' }} width="2496" height="3648" data-path="images/cat-ad/1.jpg" />

        <img src="https://mintcdn.com/comfyuiwikicom/jBy8uThZJ6MD6qYM/images/cat-ad/2.jpg?fit=max&auto=format&n=jBy8uThZJ6MD6qYM&q=85&s=463f8dce3d9eaea128f060357956642d" alt="" loading="lazy" className="h-36 w-24 rounded-xl object-cover shadow-xl ring-2 ring-white/40 transition-transform duration-300 group-hover:scale-110 sm:h-44 sm:w-28" style={{ transform: 'rotate(4deg)' }} width="2496" height="3648" data-path="images/cat-ad/2.jpg" />

        <img src="https://mintcdn.com/comfyuiwikicom/jBy8uThZJ6MD6qYM/images/cat-ad/3.jpg?fit=max&auto=format&n=jBy8uThZJ6MD6qYM&q=85&s=fbed39287e2f02a491d968dbfa7ac603" alt="" loading="lazy" className="h-32 w-24 rounded-xl object-cover shadow-xl ring-2 ring-white/40 transition-transform duration-300 group-hover:scale-110 sm:h-40 sm:w-28" style={{ transform: 'rotate(-3deg)' }} width="2496" height="3648" data-path="images/cat-ad/3.jpg" />

        <img src="https://mintcdn.com/comfyuiwikicom/jBy8uThZJ6MD6qYM/images/cat-ad/4.jpg?fit=max&auto=format&n=jBy8uThZJ6MD6qYM&q=85&s=7c0311a41764d9fc439528e0e6e545f2" alt="" loading="lazy" className="h-36 w-24 rounded-xl object-cover shadow-xl ring-2 ring-white/40 transition-transform duration-300 group-hover:scale-110 sm:h-44 sm:w-28" style={{ transform: 'rotate(5deg)' }} width="2496" height="3648" data-path="images/cat-ad/4.jpg" />

        <img src="https://mintcdn.com/comfyuiwikicom/jBy8uThZJ6MD6qYM/images/cat-ad/5.jpg?fit=max&auto=format&n=jBy8uThZJ6MD6qYM&q=85&s=9e09b191198b63a2233126e79edf584c" alt="" loading="lazy" className="h-32 w-24 rounded-xl object-cover shadow-xl ring-2 ring-white/40 transition-transform duration-300 group-hover:scale-110 sm:h-40 sm:w-28" style={{ transform: 'rotate(-4deg)' }} width="2480" height="3508" data-path="images/cat-ad/5.jpg" />

        <img src="https://mintcdn.com/comfyuiwikicom/jBy8uThZJ6MD6qYM/images/cat-ad/6.jpg?fit=max&auto=format&n=jBy8uThZJ6MD6qYM&q=85&s=471ec29753e407cb40faefe54e732c99" alt="" loading="lazy" className="h-36 w-24 rounded-xl object-cover shadow-xl ring-2 ring-white/40 transition-transform duration-300 group-hover:scale-110 sm:h-44 sm:w-28" style={{ transform: 'rotate(3deg)' }} width="2496" height="3648" data-path="images/cat-ad/6.jpg" />

        <img src="https://mintcdn.com/comfyuiwikicom/jBy8uThZJ6MD6qYM/images/cat-ad/7.jpg?fit=max&auto=format&n=jBy8uThZJ6MD6qYM&q=85&s=8e87e6a8ae8add87b8a3726fde59346e" alt="" loading="lazy" className="h-32 w-24 rounded-xl object-cover shadow-xl ring-2 ring-white/40 transition-transform duration-300 group-hover:scale-110 sm:h-40 sm:w-28" style={{ transform: 'rotate(-5deg)' }} width="2496" height="3648" data-path="images/cat-ad/7.jpg" />
      </div>

      <div className="flex flex-col items-stretch gap-4 sm:flex-row sm:items-center sm:gap-6">
        <div className="flex h-16 w-16 flex-shrink-0 self-center items-center justify-center rounded-full bg-white/20 text-4xl backdrop-blur-sm ring-2 ring-white/30 sm:h-20 sm:w-20 sm:text-5xl" aria-hidden="true">
          ✨
        </div>

        <div className="min-w-0 flex-1 text-center sm:text-left">
          <div className="mb-2 flex flex-wrap items-center justify-center gap-2 sm:justify-start">
            <span className="inline-flex items-center gap-1 rounded-full border border-white/40 bg-white/15 px-2 py-0.5 text-[10px] font-bold tracking-wider uppercase backdrop-blur-sm">
              <span className="h-1.5 w-1.5 rounded-full bg-red-300" aria-hidden="true" />

              18+
            </span>

            <span className="text-xs font-medium text-white/80">Live catalog · Updated daily</span>
          </div>

          <div className="text-xl leading-tight font-extrabold sm:text-2xl">
            Live previews & instant downloads
          </div>

          <div className="mt-1.5 text-sm leading-relaxed text-white/90 sm:text-base">
            Browse curated ComfyUI workflows, models, and tools.
          </div>
        </div>

        <div className="inline-flex flex-shrink-0 self-center items-center justify-center gap-2 rounded-full bg-white px-7 py-4 text-base font-bold whitespace-nowrap text-[#49378B] shadow-lg transition-all duration-200 group-hover:gap-3 group-hover:shadow-xl sm:px-8 sm:py-4 sm:text-lg">
          Explore now
          <span className="text-lg transition-transform duration-200 group-hover:translate-x-1" aria-hidden="true">→</span>
        </div>
      </div>
    </div>
  </a>

  <div className="px-4 max-w-5xl mx-auto">
    <p className="mx-auto mb-12 max-w-xl px-4 text-center text-lg text-gray-500 dark:text-zinc-500">
      The most powerful open source node-based application for generative AI
    </p>

    {/* Getting Started Section */}

    <div className="mb-12">
      <h2 className="mb-6 text-center text-2xl font-bold">Getting Started</h2>

      <CardGroup cols={3}>
        <Card title="Download & Install" icon="download" href="/installation/system_requirements">
          Install ComfyUI on Windows, macOS, or Linux
        </Card>

        <Card title="First Generation" icon="rocket" href="/get_started/first_generation">
          Create your first AI-generated image
        </Card>

        <Card title="Basic Concepts" icon="lightbulb" href="/development/core-concepts/workflow">
          Understand workflows, nodes, and links
        </Card>

        <Card title="Comfy Workflows" icon="globe" href="https://comfy.org/workflows">
          Explore community workflows and templates from top creators
        </Card>
      </CardGroup>
    </div>

    {/* AI Agents & MCP Section */}

    <div className="mb-12">
      <h2 className="mb-6 text-center text-2xl font-bold">AI Agents & MCP</h2>

      <CardGroup cols={3}>
        <Card title="Agent Tools Overview" icon="robot" href="/agent-tools">
          Connect AI agents via MCP for image, video, audio, and 3D generation
        </Card>

        <Card title="Cloud MCP Server" icon="server" href="/agent-tools/mcp">
          Hosted MCP at cloud.comfy.org — run workflows on Cloud GPUs
        </Card>

        <Card title="Comfy CLI" icon="terminal" href="/agent-tools/cli">
          Call partner models from the terminal with comfy generate (beta)
        </Card>
      </CardGroup>
    </div>

    {/* Learn & Tutorials Section */}

    <div className="mb-12">
      <h2 className="mb-6 text-center text-2xl font-bold">Learn & Tutorials</h2>

      <CardGroup cols={3}>
        <Card title="Interface Guide" icon="window-maximize" href="/interface/overview">
          Navigate the ComfyUI interface
        </Card>

        <Card title="Tutorials" icon="book-open" href="/tutorials/basic/text-to-image">
          Step-by-step guides for common tasks
        </Card>

        <Card title="Built-in Nodes" icon="diagram-project" href="/built-in-nodes/overview">
          Learn about each node in ComfyUI
        </Card>
      </CardGroup>
    </div>

    {/* Development Section */}

    <div className="mb-12">
      <h2 className="mb-6 text-center text-2xl font-bold">Development & Extension</h2>

      <CardGroup cols={3}>
        <Card title="Development Guide" icon="code" href="/development/overview">
          Contribute to ComfyUI development
        </Card>

        <Card title="Custom Nodes" icon="puzzle-piece" href="/custom-nodes/overview">
          Create and publish custom nodes
        </Card>

        <Card title="Local API" icon="terminal" href="/development/comfyui-server/comms_overview">
          Integrate with local ComfyUI server
        </Card>

        <Card title="Cloud API" icon="cloud" href="/development/cloud/overview">
          Run workflows via ComfyUI Cloud API
        </Card>

        <Card title="Cloud API Reference" icon="book" href="/development/cloud/api-reference">
          Explore the ComfyUI Cloud API reference
        </Card>
      </CardGroup>
    </div>

    {/* Get Help Section */}

    <div className="mb-12">
      <h2 className="mb-6 text-center text-2xl font-bold">Get Help</h2>

      <CardGroup cols={3}>
        <Card title="Contact Support" icon="headset" href="/support/contact-support">
          Get help from our support team
        </Card>

        <Card title="Account Management" icon="user-gear" href="/account/create-account">
          Create, login, and manage your account
        </Card>

        <Card title="Billing Support" icon="credit-card" href="/support/subscription/subscribing">
          Manage subscriptions and payments
        </Card>

        <Card title="Troubleshooting" icon="circle-question" href="/troubleshooting/overview">
          Resolve common issues and errors
        </Card>

        <Card title="Community" icon="users" href="/community/links">
          Join the ComfyUI community
        </Card>
      </CardGroup>
    </div>

    {/* About ComfyUI Section */}

    <div className="text-center mt-16 mb-8">
      <h2 className="text-2xl font-bold mb-4">About ComfyUI</h2>

      <p className="mb-4">
        Written by <a href="https://github.com/comfyanonymous" className="text-blue-500 dark:text-blue-400 underline hover:text-blue-600 dark:hover:text-blue-500">comfyanonymous</a> and other <a href="https://github.com/Comfy-Org/ComfyUI/graphs/contributors" className="text-blue-500 dark:text-blue-400 underline hover:text-blue-600 dark:hover:text-blue-500">contributors</a>.
      </p>

      <ul className="list-none space-y-2 max-w-2xl mx-auto">
        <li><strong>ComfyUI</strong> is a node-based interface and inference engine for generative AI</li>
        <li>Users can combine various AI models and operations through nodes to achieve highly customizable and controllable content generation</li>
        <li>ComfyUI is completely open source and can run on your local device</li>
      </ul>
    </div>
  </div>
</div>