> ## Documentation Index
> Fetch the complete documentation index at: https://tfh-outlining-world-id-yc.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# World ID

export const Quickstart = ({title = "Developer quickstart", description = "Make your first API request in minutes. Learn the basics of the platform.", buttonHref = "/docs/get-started", buttonLabel = "Get started", agentPrompt, children}) => {
  const promptCfg = agentPrompt ? {
    skillUrl: agentPrompt.skillUrl || "world.id/SKILL.md",
    productName: agentPrompt.productName || "World ID"
  } : null;
  const promptText = promptCfg ? `Read ${promptCfg.skillUrl} and add ${promptCfg.productName} to my app` : null;
  const copyIcon = <svg width="16" height="16" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
      <path d="M14.25 5.25H7.25C6.14543 5.25 5.25 6.14543 5.25 7.25V14.25C5.25 15.3546 6.14543 16.25 7.25 16.25H14.25C15.3546 16.25 16.25 15.3546 16.25 14.25V7.25C16.25 6.14543 15.3546 5.25 14.25 5.25Z" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"></path>
      <path d="M2.80103 11.998L1.77203 5.07397C1.61003 3.98097 2.36403 2.96397 3.45603 2.80197L10.38 1.77297C11.313 1.63397 12.19 2.16297 12.528 3.00097" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"></path>
    </svg>;
  const onCopy = text => e => {
    try {
      navigator.clipboard.writeText(text);
      const btn = e.currentTarget;
      const icon = btn.querySelector("[data-copy-icon]");
      const tick = btn.querySelector("[data-copy-tick]");
      if (icon && tick) {
        icon.style.display = "none";
        tick.style.display = "inline-flex";
        setTimeout(() => {
          icon.style.display = "inline-flex";
          tick.style.display = "none";
        }, 1200);
      }
    } catch (_) {}
  };
  return <div className="not-prose rounded-3xl bg-zinc-100 p-6 md:p-8 dark:bg-zinc-900">
      <div className="grid grid-cols-1 gap-8 md:grid-cols-[minmax(280px,1fr)_minmax(360px,1.45fr)] md:items-start">
        <div>
          <h3 className="m-0 text-2xl leading-tight font-semibold text-zinc-900 dark:text-zinc-100">
            {title}
          </h3>
          <p className="mt-3 max-w-[560px] text-[16px] leading-7 text-zinc-600 dark:text-zinc-300">
            {description}
          </p>
        </div>

        <div className="quickstart-code min-w-0">{children}</div>
      </div>

      {promptText ? <div className="mt-6">
          <div className="my-4 flex items-center gap-3">
            <div className="h-px flex-1 bg-zinc-200 dark:bg-white/10"></div>
            <span className="font-mono text-xs text-zinc-500 dark:text-zinc-400">OR</span>
            <div className="h-px flex-1 bg-zinc-200 dark:bg-white/10"></div>
          </div>
          <p className="m-0 mb-2 text-sm text-zinc-500 dark:text-zinc-400">
            Tell your coding agent to:
          </p>
          <div className="group relative overflow-hidden rounded-xl border border-zinc-200 dark:border-white/10" style={{
    backgroundColor: "#FAFAFA"
  }}>
            <div className="dark-bg pointer-events-none absolute inset-0 hidden dark:block" style={{
    backgroundColor: "#0B0C0E"
  }} />
            <pre className="relative m-0 overflow-x-auto bg-transparent px-4 py-3 font-mono text-sm leading-6" style={{
    color: "#1F2328"
  }}>
              <code className="bg-transparent p-0 text-inherit dark:!text-[#D4D4D4]">
                <span>Read </span>
                <a href={`https://${promptCfg.skillUrl}`} target="_blank" rel="noopener noreferrer" className="text-inherit underline decoration-zinc-400 underline-offset-2 hover:decoration-zinc-700 dark:decoration-zinc-500 dark:hover:decoration-zinc-200">
                  {promptCfg.skillUrl}
                </a>
                <span>{` and add ${promptCfg.productName} to my app`}</span>
              </code>
            </pre>
            <button type="button" aria-label="Copy" onClick={onCopy(promptText)} className="absolute right-2 top-2 inline-flex h-8 w-8 cursor-pointer items-center justify-center rounded-md text-zinc-500 transition-colors hover:bg-gray-600/5 hover:text-zinc-700 dark:text-zinc-400 dark:hover:bg-gray-200/5 dark:hover:text-zinc-200">
              <span data-copy-icon className="inline-flex">{copyIcon}</span>
              <span data-copy-tick style={{
    display: "none"
  }} className="text-emerald-600 dark:text-emerald-400">✓</span>
            </button>
          </div>
        </div> : null}

      <div className="mt-6 md:mt-4">
        <a href={buttonHref} className="inline-flex items-center justify-center rounded-full border border-transparent bg-zinc-950 px-6 py-3 text-[16px] font-medium !text-white no-underline transition-colors hover:bg-black dark:border-zinc-700 dark:bg-zinc-800 dark:!text-zinc-100 dark:hover:bg-zinc-700">
          {buttonLabel}
        </a>
      </div>
    </div>;
};

World ID is a privacy-preserving protocol that lets people prove they are real and unique online without revealing anything else about them.

It gives developers a high-assurance trust layer to stop bots, Sybil attacks and deepfakes — while keeping onboarding fast and private, with user data off your servers.

Through credentials like Proof of Human, Document and Selfie Check, World ID extends that trust layer with additional proofs without exposing underlying user data.

<Quickstart title="Developer Quickstart" description="Enable secure identity verification in your app or on your platform with one React widget." buttonHref="/world-id/idkit/integrate" buttonLabel="Open integration guide" agentPrompt={{ skillUrl: "world.id/SKILL.md", productName: "World ID" }}>
  ```tsx lines theme={null}
  import { IDKitRequestWidget } from "@worldcoin/idkit";
  const rpContext = await getRpContext("verify-account");
  <IDKitRequestWidget
    app_id="app_xxxxx"
    action="verify-account"
    rp_context={rpContext}
    // verify proof + nullifier on your backend
    handleVerify={verifyOnBackend}
    onSuccess={unlockFeature}
  />
  ```
</Quickstart>

## Credentials

<div className="not-prose mt-5">
  <div className="grid gap-4 md:grid-cols-3">
    <a href="/world-id/credentials/1" className="block overflow-hidden rounded-[12px] border border-zinc-200 bg-white no-underline shadow-[0_1px_0_rgba(0,0,0,0.03)] transition-all duration-200 hover:-translate-y-0.5 hover:shadow-[0_10px_26px_rgba(15,23,42,0.08)] dark:border-zinc-700 dark:bg-zinc-900 dark:shadow-none dark:hover:border-zinc-600 dark:hover:shadow-[0_10px_24px_rgba(2,6,23,0.32)]">
      <div className="flex items-center justify-center bg-white dark:bg-zinc-900" style={{ height: 120 }}>
        <img noZoom src="https://mintcdn.com/tfh-outlining-world-id-yc/fTRAMAkKfl8ZJYBK/images/docs/verification-badge.svg?fit=max&auto=format&n=fTRAMAkKfl8ZJYBK&q=85&s=27d280d717f43fd6ae20d5d06d69ae15" alt="Proof of Human" style={{ height: 72, width: 72, objectFit: 'contain' }} width="24" height="24" data-path="images/docs/verification-badge.svg" />
      </div>

      <div className="p-4"><h3 className="m-0 text-base font-semibold text-zinc-900 dark:text-zinc-100">Proof of Human</h3><p className="mt-2 text-sm text-zinc-600 dark:text-zinc-300">Highest-assurance uniqueness signal from Orb verification. Best for one-person-one-action flows and strongest Sybil resistance.</p></div>
    </a>

    <a href="/world-id/credentials/9303" className="block overflow-hidden rounded-[12px] border border-zinc-200 bg-white no-underline shadow-[0_1px_0_rgba(0,0,0,0.03)] transition-all duration-200 hover:-translate-y-0.5 hover:shadow-[0_10px_26px_rgba(15,23,42,0.08)] dark:border-zinc-700 dark:bg-zinc-900 dark:shadow-none dark:hover:border-zinc-600 dark:hover:shadow-[0_10px_24px_rgba(2,6,23,0.32)]">
      <div className="flex items-center justify-center bg-white dark:bg-zinc-900" style={{ height: 120 }}>
        <img noZoom src="https://mintcdn.com/tfh-outlining-world-id-yc/fTRAMAkKfl8ZJYBK/images/docs/passport.png?fit=max&auto=format&n=fTRAMAkKfl8ZJYBK&q=85&s=08a3fa209c704894536008ca9c9a0093" alt="Document" style={{ width: 72, objectFit: 'contain' }} width="374" height="493" data-path="images/docs/passport.png" />
      </div>

      <div className="p-4"><h3 className="m-0 text-base font-semibold text-zinc-900 dark:text-zinc-100">Document</h3><p className="mt-2 text-sm text-zinc-600 dark:text-zinc-300">Proves possession of a unique government document through NFC checks. Useful for fast proof of age and document-backed access flows.</p></div>
    </a>

    <a href="/world-id/credentials/11" className="block overflow-hidden rounded-[12px] border border-zinc-200 bg-white no-underline shadow-[0_1px_0_rgba(0,0,0,0.03)] transition-all duration-200 hover:-translate-y-0.5 hover:shadow-[0_10px_26px_rgba(15,23,42,0.08)] dark:border-zinc-700 dark:bg-zinc-900 dark:shadow-none dark:hover:border-zinc-600 dark:hover:shadow-[0_10px_24px_rgba(2,6,23,0.32)]">
      <div className="flex items-center justify-center bg-white dark:bg-zinc-900" style={{ height: 120 }}>
        <img noZoom src="https://mintcdn.com/tfh-outlining-world-id-yc/fTRAMAkKfl8ZJYBK/images/docs/selfie-check.png?fit=max&auto=format&n=fTRAMAkKfl8ZJYBK&q=85&s=81b082807fda70bd53c8e3981936bec1" alt="Selfie Check" style={{ height: 72, width: 72, objectFit: 'contain' }} width="352" height="352" data-path="images/docs/selfie-check.png" />
      </div>

      <div className="p-4"><h3 className="m-0 flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100">Selfie Check <div className="method-pill rounded-lg bg-blue-400/20 px-1.5 py-0.5 text-sm leading-5 font-semibold text-blue-700 dark:bg-blue-400/20 dark:text-blue-300">Beta</div></h3><p className="mt-2 text-sm text-zinc-600 dark:text-zinc-300">Low-friction, medium-assurance liveness and uniqueness signal from a selfie flow. Best for sign-up and bot defense where speed matters most.</p></div>
    </a>
  </div>
</div>

## Start building

<CardGroup cols={1}>
  <Card title="Stop bots and duplicate accounts">
    Use proof of human to enforce one human per account and reduce Sybil abuse in rewards, referrals, governance and account creation.
  </Card>

  <Card title="Protect conversion and user privacy">
    Replace CAPTCHA-heavy or document-heavy gating with reusable proof flows. Relying parties receive proofs, not personal data.
  </Card>
</CardGroup>

## Privacy by architecture

<CardGroup cols={3}>
  <Card title="Zero-knowledge proofs">
    Users prove what is true without revealing personal information. World ID generates identifiers scoped to each app and action, preventing different apps from using the proofs to correlate a person’s activity.
  </Card>

  <Card title="Multi-party computation">
    Matching and uniqueness checks are split across independent nodes so no single party holds complete sensitive data.
  </Card>

  <Card title="Self-custodial">
    Proof generation happens on the user’s device and can bind a developer-provided signal to the proof. Your app receives the proof, not raw personal data.
  </Card>
</CardGroup>
