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

# Welcome

> Add human oversight to your AI workflows with our mobile-first platform. Create loops, send requests for human review, and receive structured responses via API.

export const HeroCard = ({ filename, title, description, href }) => {
  return (
    <a className="group cursor-pointer pb-8" href={href}>
      <img
        src={`/images/hero/${filename}.png`}
        className="block w-full h-auto dark:hidden pointer-events-none group-hover:scale-105 transition-all duration-100 rounded-lg"
        alt=""
      />
      <img
        src={`/images/hero/${filename}-dark.png`}
        className="block w-full h-auto pointer-events-none group-hover:scale-105 transition-all duration-100 hidden dark:block rounded-lg"
        alt=""
      />
      <h3 className="mt-5 text-gray-900 dark:text-zinc-50 font-medium">
        {title}
      </h3>
      <span className="mt-1.5">{description}</span>
    </a>
  );
};

<div className="relative">
  <div className="absolute -top-14 left-0 right-0 opacity-80">
    <img src="https://mintcdn.com/hitl/otmbmE8XIQLzh-V6/images/hero/background-light.svg?fit=max&auto=format&n=otmbmE8XIQLzh-V6&q=85&s=e393ec93cc3f90a172f657bc125dde65" className="block dark:hidden pointer-events-none w-full h-auto" alt="Decorative background image." width="1152" height="388" data-path="images/hero/background-light.svg" />

    <img src="https://mintcdn.com/hitl/otmbmE8XIQLzh-V6/images/hero/background-dark.svg?fit=max&auto=format&n=otmbmE8XIQLzh-V6&q=85&s=0a957036f82286113d0dfed13758b31b" className="hidden dark:block pointer-events-none w-full h-auto" alt="Decorative background image." width="1152" height="388" data-path="images/hero/background-dark.svg" />
  </div>

  <div className="relative z-10 w-full max-w-6xl px-4 sm:px-6 lg:px-10 py-16 lg:py-48 lg:pb-24 mx-auto">
    <h1 className="block text-4xl font-medium text-center text-gray-900 dark:text-zinc-50 tracking-tight">
      HITL.sh
    </h1>

    <div className="max-w-xl mx-auto px-4 mt-4 text-lg text-center text-gray-500 dark:text-zinc-500">
      Add human oversight to your AI workflows with our mobile-first platform. Create loops, send requests for human review, and receive structured responses via API.
    </div>

    <div className="px-6 lg:px-0 mt-12 lg:mt-24 grid sm:grid-cols-2 gap-x-6 gap-y-4">
      <HeroCard filename="rocket" title="Create Your First Loop" description="Set up your first human-in-the-loop workflow in minutes with our API." href="/first-loop" />

      <HeroCard filename="cli" title="Mobile-First Reviews" description="Reviewers receive instant push notifications and can respond on-the-go using our native mobile app." href="/mobile/home-screen" />

      <HeroCard filename="components" title="API Reference" description="Full-featured REST API for creating loops, submitting requests, and receiving responses." href="/api-reference/introduction" />

      <HeroCard filename="editor" title="Integrations" description="Connect HITL.sh to thousands of apps through Zapier or n8n." href="/integrations/n8n" />
    </div>
  </div>
</div>