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

# Core Components

> Explore the key building blocks of Compozy that work together to create powerful AI automation workflows:

export const FeatureCardGroup = ({children, cols = 2}) => {
  const colsClassName = ({
    1: "sm:grid-cols-1",
    2: "sm:grid-cols-2",
    3: "sm:grid-cols-3",
    4: "sm:grid-cols-4"
  })[cols] || "sm:grid-cols-2";
  return <div style={{
    display: 'grid'
  }} className={`${colsClassName} gap-6 my-6`}>
      {children}
    </div>;
};

export const FeatureCard = ({title, description, icon, href}) => <div className="card not-prose font-normal group relative my-2 ring-2 ring-transparent rounded-2xl bg-white dark:bg-background-dark border border-gray-950/10 dark:border-white/10 overflow-hidden">
    <div className="p-6 flex flex-col h-full">
      <div className="flex items-center gap-3 mb-4">
        {icon && <div className="w-8 h-8 flex items-center justify-center rounded-lg bg-primary/10 px-1">
            <Icon icon={icon} iconType="solid" size={18} />
          </div>}
        <h3 className="font-semibold text-lg text-gray-900 dark:text-white">
          {title}
        </h3>
      </div>

      <div className="text-gray-500 dark:text-gray-400 text-base flex-1">
        {description}
      </div>

      {href && <div className="mt-4 flex items-center gap-2 text-sm font-medium text-primary">
          See more
          <Icon icon="chevron-right" iconType="solid" size={12} className="transition-transform group-hover:translate-x-0.5" />
        </div>}
    </div>
    {href && <a href={href} className="absolute inset-0" />}
  </div>;

<FeatureCardGroup cols={2}>
  <FeatureCard title="Base Structure" description="Learn about the foundational project structure, configuration files, and organization of Compozy projects." icon="folder-tree" href="/core/base-structure/overview" />

  <FeatureCard title="CLI Tool" description="Command-line interface for building, testing, and deploying AI workflows with powerful development features." icon="terminal" href="/core/cli/overview" />

  <FeatureCard title="Tools" description="Reusable functions that perform specific operations like API calls, data processing, and external service integrations." icon="wrench" href="/core/tools/overview" />

  <FeatureCard title="Agents" description="AI-powered components that can understand instructions, use tools, and make decisions within your workflows." icon="robot" href="/core/agents/overview" />

  <FeatureCard title="Tasks" description="Building blocks that execute specific operations and manage workflow steps with advanced flow control." icon="list-check" href="/core/tasks/overview" />

  <FeatureCard title="MCP Servers" description="Model Context Protocol servers that maintain context across interactions and handle external service integrations." icon="plug" href="/core/mcp/overview" />

  <FeatureCard title="Workflows" description="Declarative YAML-based orchestration that combines tasks, agents, and tools into automated processes." icon="diagram-project" href="/core/workflows/overview" />

  <FeatureCard title="Memory" description="Context management system that maintains state, conversation history, and enables semantic search across interactions." icon="brain" href="/core/memory/overview" />
</FeatureCardGroup>