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

# Stigg Documentation

> Find the right documentation for your needs.

export const HeroCard = ({filename, title, description, href}) => {
  return <a href={href} className="group block cursor-pointer">
      <img src={`/images/cards/${filename}-light.png`} className="block dark:hidden pointer-events-none transition-all duration-150 rounded-md group-hover:ring-1 group-hover:ring-[#29B32E]" />
      <img src={`/images/cards/${filename}.png`} className="hidden dark:block pointer-events-none transition-all duration-150 rounded-md group-hover:ring-1 group-hover:ring-[#29B32E]" />
      <h3 className="mt-5 text-gray-900 dark:text-zinc-50 font-medium">{title}</h3>
      <p className="mt-1.5">{description}</p>
    </a>;
};

<div className="relative">
  <div className="absolute top-0 lg:-top-16 left-0 right-0">
    <img className="block dark:hidden pointer-events-none" />

    <img className="hidden dark:block pointer-events-none" />
  </div>

  <div className="px-4 py-16 lg:py-24 max-w-3xl mx-auto">
    <h1 className="text-4xl font-medium text-center text-gray-900 dark:text-zinc-50 tracking-tight">
      <span className="block">Stigg documentation</span>
    </h1>

    <p className="max-w-xl mx-auto px-4 mt-4 text-lg text-center text-gray-500 dark:text-zinc-500">
      Find the right documentation for your needs.
    </p>

    <div className="px-6 lg:px-0 mt-12 grid sm:grid-cols-2 gap-x-6 gap-y-3">
      <HeroCard filename="documentation" title="Documentation" description="Learn how to use Stigg step by step, from setup to advanced features." href="./documentation/getting-started/welcome-to-stigg" />

      <HeroCard filename="guides" title="Guides" description="Practical guides to help you accomplish specific tasks in Stigg." href="./guides/quick-start-guides/provisioning-customers" />
    </div>

    <div className="px-6 lg:px-0 mt-12 grid sm:grid-cols-2 gap-x-6 gap-y-3">
      <HeroCard filename="api" title="API and SDK" description="Detailed API and SDK documentation for integrating Stigg into your system." href="./api-and-sdks" />

      <HeroCard filename="faqs" title="FAQ" description="Get answers for the frequently most asked questions." href="./faq" />
    </div>
  </div>
</div>

<div className="max-w-3xl mx-auto px-6 lg:px-0">
  <h2 className="text-center text-xl font-medium text-gray-900 dark:text-zinc-50 mb-6">
    Supported APIs & SDKs
  </h2>

  <p className="text-xs font-semibold uppercase tracking-wide text-gray-400 dark:text-zinc-500 mb-2">Backend</p>

  <Tabs>
    <Tab title="REST (Recommended)">
      <div className="grid grid-cols-2 sm:grid-cols-4 gap-x-6 gap-y-3 mt-4">
        <Card href="api-and-sdks/api-reference/rest/overview" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2">
            <span className="text-xs font-medium">REST API</span>
          </div>
        </Card>

        <Card href="api-and-sdks/references/sdk/backend/rest/typescript" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/FZ_ywutvYHnQbKpn/images/node.svg?fit=max&auto=format&n=FZ_ywutvYHnQbKpn&q=85&s=6f3c4e317c6247302f736514377622ba" alt="TypeScript" className="w-5 h-5" width="590" height="361" data-path="images/node.svg" />

            <span className="text-xs font-medium">TypeScript</span>
          </div>
        </Card>

        <Card href="api-and-sdks/references/sdk/backend/rest/python" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/FZ_ywutvYHnQbKpn/images/python.svg?fit=max&auto=format&n=FZ_ywutvYHnQbKpn&q=85&s=8aa4c263d3355c39616dac4786167a63" alt="Python" className="w-5 h-5" width="64" height="64" data-path="images/python.svg" />

            <span className="text-xs font-medium">Python</span>
          </div>
        </Card>

        <Card href="api-and-sdks/references/sdk/backend/rest/go" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/aJeGPh9dwMpK_Kcr/images/go.svg?fit=max&auto=format&n=aJeGPh9dwMpK_Kcr&q=85&s=14fba808f81d5b37031e986828224216" alt="Go" className="w-5 h-5" width="256" height="96" data-path="images/go.svg" />

            <span className="text-xs font-medium">Go</span>
          </div>
        </Card>

        <Card href="api-and-sdks/references/sdk/backend/rest/ruby" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/FZ_ywutvYHnQbKpn/images/ruby.svg?fit=max&auto=format&n=FZ_ywutvYHnQbKpn&q=85&s=bfbfc0efe42725d5dcce5c007af63b6f" alt="Ruby" className="w-5 h-5" width="64" height="64" data-path="images/ruby.svg" />

            <span className="text-xs font-medium">Ruby</span>
          </div>
        </Card>

        <Card href="api-and-sdks/references/sdk/backend/rest/csharp" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/aJeGPh9dwMpK_Kcr/images/dotnet.svg?fit=max&auto=format&n=aJeGPh9dwMpK_Kcr&q=85&s=82b5aa77d4f286682eb57d04f583d969" alt="C#" className="w-5 h-5" width="512" height="512" data-path="images/dotnet.svg" />

            <span className="text-xs font-medium">C#</span>
          </div>
        </Card>

        <Card href="api-and-sdks/references/sdk/backend/rest/java" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/aJeGPh9dwMpK_Kcr/images/java.svg?fit=max&auto=format&n=aJeGPh9dwMpK_Kcr&q=85&s=2b995d4253d62bc092ad570c6aea8650" alt="Java" className="w-5 h-5" width="64" height="64" data-path="images/java.svg" />

            <span className="text-xs font-medium">Java</span>
          </div>
        </Card>
      </div>
    </Tab>

    <Tab title="GraphQL (Legacy)">
      <div className="grid grid-cols-2 sm:grid-cols-4 gap-x-6 gap-y-3 mt-4">
        <Card href="api-and-sdks/integration/backend/nodejs" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/FZ_ywutvYHnQbKpn/images/node.svg?fit=max&auto=format&n=FZ_ywutvYHnQbKpn&q=85&s=6f3c4e317c6247302f736514377622ba" alt="Node.js" className="w-5 h-5" width="590" height="361" data-path="images/node.svg" />

            <span className="text-xs font-medium">Node.js</span>
          </div>
        </Card>

        <Card href="api-and-sdks/integration/backend/sidecar" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/KDLt6IBFr9faql2Z/images/docker.svg?fit=max&auto=format&n=KDLt6IBFr9faql2Z&q=85&s=69cd90d86f6197796d6a60fb9e5b92ba" alt="Sidecar" className="w-5 h-5" width="36" height="36" data-path="images/docker.svg" />

            <span className="text-xs font-medium">Sidecar</span>
          </div>
        </Card>

        <Card href="api-and-sdks/integration/backend/python" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/FZ_ywutvYHnQbKpn/images/python.svg?fit=max&auto=format&n=FZ_ywutvYHnQbKpn&q=85&s=8aa4c263d3355c39616dac4786167a63" alt="Python" className="w-5 h-5" width="64" height="64" data-path="images/python.svg" />

            <span className="text-xs font-medium">Python</span>
          </div>
        </Card>

        <Card href="api-and-sdks/integration/backend/ruby" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/FZ_ywutvYHnQbKpn/images/ruby.svg?fit=max&auto=format&n=FZ_ywutvYHnQbKpn&q=85&s=bfbfc0efe42725d5dcce5c007af63b6f" alt="Ruby" className="w-5 h-5" width="64" height="64" data-path="images/ruby.svg" />

            <span className="text-xs font-medium">Ruby</span>
          </div>
        </Card>

        <Card href="api-and-sdks/integration/backend/go" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/aJeGPh9dwMpK_Kcr/images/go.svg?fit=max&auto=format&n=aJeGPh9dwMpK_Kcr&q=85&s=14fba808f81d5b37031e986828224216" alt="Go" className="w-5 h-5" width="256" height="96" data-path="images/go.svg" />

            <span className="text-xs font-medium">Go</span>
          </div>
        </Card>

        <Card href="api-and-sdks/integration/backend/java" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/aJeGPh9dwMpK_Kcr/images/java.svg?fit=max&auto=format&n=aJeGPh9dwMpK_Kcr&q=85&s=2b995d4253d62bc092ad570c6aea8650" alt="Java" className="w-5 h-5" width="64" height="64" data-path="images/java.svg" />

            <span className="text-xs font-medium">Java</span>
          </div>
        </Card>

        <Card href="api-and-sdks/integration/backend/dotnet" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/aJeGPh9dwMpK_Kcr/images/dotnet.svg?fit=max&auto=format&n=aJeGPh9dwMpK_Kcr&q=85&s=82b5aa77d4f286682eb57d04f583d969" alt=".NET" className="w-5 h-5" width="512" height="512" data-path="images/dotnet.svg" />

            <span className="text-xs font-medium">.NET</span>
          </div>
        </Card>

        <Card href="api-and-sdks/integration/backend/graphql" className="rounded-sm p-0 m-0">
          <div className="flex items-center h-10 px-2 gap-2">
            <img src="https://mintcdn.com/stigg/aJeGPh9dwMpK_Kcr/images/graphql.svg?fit=max&auto=format&n=aJeGPh9dwMpK_Kcr&q=85&s=188b90d3ea43904bab4702ab8b7b4a8d" alt="GraphQL" className="w-5 h-5" width="64" height="64" data-path="images/graphql.svg" />

            <span className="text-xs font-medium">GraphQL</span>
          </div>
        </Card>
      </div>
    </Tab>
  </Tabs>

  <p className="text-xs font-semibold uppercase tracking-wide text-gray-400 dark:text-zinc-500 mt-6 mb-2">Frontend</p>

  <div className="grid grid-cols-2 sm:grid-cols-4 gap-x-6 gap-y-3">
    <Card href="api-and-sdks/integration/frontend/javascript" className="rounded-sm p-0 m-0">
      <div className="flex items-center h-10 px-2 gap-2">
        <img src="https://mintcdn.com/stigg/aJeGPh9dwMpK_Kcr/images/javascript.svg?fit=max&auto=format&n=aJeGPh9dwMpK_Kcr&q=85&s=f921e112c866aa202b98db5c0a6c10da" alt="JavaScript" className="w-5 h-5" width="800" height="800" data-path="images/javascript.svg" />

        <span className="text-xs font-medium">JavaScript</span>
      </div>
    </Card>

    <Card href="api-and-sdks/integration/frontend/react" className="rounded-sm p-0 m-0">
      <div className="flex items-center h-10 px-2 gap-2">
        <img src="https://mintcdn.com/stigg/FZ_ywutvYHnQbKpn/images/react.svg?fit=max&auto=format&n=FZ_ywutvYHnQbKpn&q=85&s=75e8661a7d87b8e2b3493d7fdfb33db9" alt="React" className="w-5 h-5" width="23" height="20" data-path="images/react.svg" />

        <span className="text-xs font-medium">React</span>
      </div>
    </Card>

    <Card href="api-and-sdks/integration/frontend/vuejs" className="rounded-sm p-0 m-0">
      <div className="flex items-center h-10 px-2 gap-2">
        <img src="https://mintcdn.com/stigg/qpsRT7dNo0hXTxnb/images/vue.svg?fit=max&auto=format&n=qpsRT7dNo0hXTxnb&q=85&s=c861442fd84f9822a716d778b10a8dba" alt="Vue" className="w-5 h-5" width="800" height="800" data-path="images/vue.svg" />

        <span className="text-xs font-medium">Vue.js</span>
      </div>
    </Card>

    <Card href="api-and-sdks/integration/frontend/nextjs" className="rounded-sm p-0 m-0">
      <div className="flex items-center h-10 px-2 gap-2">
        <img src="https://mintcdn.com/stigg/FZ_ywutvYHnQbKpn/images/next.svg?fit=max&auto=format&n=FZ_ywutvYHnQbKpn&q=85&s=7fea95b3e8f678015cb8b8d58d1e7886" alt="Next.js" className="w-5 h-5" width="16" height="16" data-path="images/next.svg" />

        <span className="text-xs font-medium">Next.js</span>
      </div>
    </Card>

    <Card href="api-and-sdks/integration/frontend/html" className="rounded-sm p-0 m-0">
      <div className="flex items-center h-10 px-2 gap-2">
        <img src="https://mintcdn.com/stigg/aJeGPh9dwMpK_Kcr/images/html.svg?fit=max&auto=format&n=aJeGPh9dwMpK_Kcr&q=85&s=ae948dc9e5ca66cf75892b94859954a0" alt="HTML Widgets" className="w-5 h-5" width="800" height="800" data-path="images/html.svg" />

        <span className="text-xs font-medium">Webflow, Wordpress & HTML</span>
      </div>
    </Card>
  </div>
</div>
