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

# Circle developer docs

export const HeroSection = () => {
  useEffect(() => {
    const header = document.querySelector("div#content-area > header#header");
    if (header) {
      header.style.display = "none";
    }
    const mdxContent = document.querySelector("div.mdx-content");
    if (mdxContent) {
      mdxContent.style.marginTop = "0";
    }
    return () => {
      const header = document.querySelector("div#content-area > header#header");
      if (header) {
        header.style.display = "";
      }
      const mdxContent = document.querySelector("div.mdx-content");
      if (mdxContent) {
        mdxContent.style.marginTop = "";
      }
    };
  }, []);
  return <div className="relative w-full mt-0 sm:mb-4 md:mb-4">
      <h1 className="text-4xl font-semibold text-[#29233B] dark:text-white mb-[16px] leading-[36px]">
        Circle developers
      </h1>
      <p className="mb-[24px] text-[#6B6580] dark:text-[#9CA3AF] text-xl leading-[28px]">
        Build apps that move money, bridge between blockchains, and manage
        digital assets with Circle's developer products.
      </p>
      <div className="flex flex-col sm:flex-row gap-2 sm:gap-4 mt-6">
        <a href="/ai/skills" className="cursor-pointer border border-[#0073C3] dark:border-[#5FBFFF] text-white dark:text-black h-[40px] px-4 rounded-lg inline-flex items-center justify-center gap-2 bg-[#0073C3] dark:bg-[#5FBFFF] hover:bg-[#1AA3FF] dark:hover:bg-[#1AA3FF] transition-all duration-300 whitespace-nowrap">
          <Icon icon="wand-magic-sparkles" color="currentColor" size={24} />
          Start with skills
        </a>
        <a href="/ai/mcp" className="cursor-pointer border border-[#0073C380] dark:border-[#90D2FF60] text-[#0073C3] dark:text-[#90D2FF] h-[40px] px-4 rounded-lg inline-flex items-center justify-center gap-2 hover:bg-[#5FBFFF1A] dark:hover:bg-[#1894E833] transition-all duration-300 whitespace-nowrap">
          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
            <rect x="3" y="3" width="18" height="6" rx="1" />
            <rect x="3" y="15" width="18" height="6" rx="1" />
            <line x1="6" y1="6" x2="6.01" y2="6" />
            <line x1="6" y1="18" x2="6.01" y2="18" />
          </svg>
          MCP server
        </a>
      </div>
    </div>;
};

<HeroSection />

## Use cases

<CardGroup cols={3}>
  <Card title="Embedded wallets" icon="wallet" href="/wallets/dev-controlled/create-your-first-wallet">
    Add wallets and USDC payments directly in your app.
  </Card>

  <Card title="Crosschain transfers" icon="arrow-right-arrow-left" href="/cctp/quickstarts/transfer-usdc-ethereum-to-arc">
    Move USDC natively between blockchains with CCTP.
  </Card>

  <Card title="Chain-abstracted balances" icon="coin-blank" href="/gateway/quickstarts/unified-balance-evm">
    Create a unified USDC balance across multiple EVM chains.
  </Card>
</CardGroup>

## Workflows

<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
  <div className="bg-white dark:bg-transparent border border-[#29233B1A] dark:border-white/[0.08] rounded-[14px] overflow-hidden">
    <div className="flex items-center gap-3 px-5 pt-5 pb-4">
      <span className="text-[16px] text-[#29233B] dark:text-white font-semibold">
        Accept stablecoin payments
      </span>
    </div>

    <a href="/wallets/dev-controlled/create-your-first-wallet" className="group flex items-center justify-between px-5 py-3 border-t border-[#29233B0D] dark:border-white/[0.06] no-underline hover:bg-[#0073C30A] dark:hover:bg-[#0073C315] transition-colors">
      <span className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] group-hover:text-[#29233B] dark:group-hover:text-white transition-colors">
        Create a wallet
      </span>

      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" className="stroke-[#6B6580]/40 dark:stroke-[#666] group-hover:stroke-[#6B6580] dark:group-hover:stroke-[#9CA3AF] group-hover:translate-x-0.5 transition" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
        <path d="M9 18l6-6-6-6" />
      </svg>
    </a>

    <a href="/stablecoins/quickstarts/transfer-usdc-evm" className="group flex items-center justify-between px-5 py-3 border-t border-[#29233B0D] dark:border-white/[0.06] no-underline hover:bg-[#0073C30A] dark:hover:bg-[#0073C315] transition-colors">
      <span className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] group-hover:text-[#29233B] dark:group-hover:text-white transition-colors">
        Transfer USDC
      </span>

      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" className="stroke-[#6B6580]/40 dark:stroke-[#666] group-hover:stroke-[#6B6580] dark:group-hover:stroke-[#9CA3AF] group-hover:translate-x-0.5 transition" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
        <path d="M9 18l6-6-6-6" />
      </svg>
    </a>

    <a href="/cpn/managed-payments/quickstarts/receive-stablecoin-payins" className="group flex items-center justify-between px-5 py-3 border-t border-[#29233B0D] dark:border-white/[0.06] no-underline hover:bg-[#0073C30A] dark:hover:bg-[#0073C315] transition-colors">
      <span className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] group-hover:text-[#29233B] dark:group-hover:text-white transition-colors">
        Receive payins
      </span>

      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" className="stroke-[#6B6580]/40 dark:stroke-[#666] group-hover:stroke-[#6B6580] dark:group-hover:stroke-[#9CA3AF] group-hover:translate-x-0.5 transition" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
        <path d="M9 18l6-6-6-6" />
      </svg>
    </a>
  </div>

  <div className="bg-white dark:bg-transparent border border-[#29233B1A] dark:border-white/[0.08] rounded-[14px] overflow-hidden">
    <div className="flex items-center gap-3 px-5 pt-5 pb-4">
      <span className="text-[16px] text-[#29233B] dark:text-white font-semibold">
        Move USDC across chains
      </span>
    </div>

    <a href="/cctp/quickstarts/transfer-usdc-ethereum-to-arc" className="group flex items-center justify-between px-5 py-3 border-t border-[#29233B0D] dark:border-white/[0.06] no-underline hover:bg-[#0073C30A] dark:hover:bg-[#0073C315] transition-colors">
      <span className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] group-hover:text-[#29233B] dark:group-hover:text-white transition-colors">
        Bridge with CCTP
      </span>

      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" className="stroke-[#6B6580]/40 dark:stroke-[#666] group-hover:stroke-[#6B6580] dark:group-hover:stroke-[#9CA3AF] group-hover:translate-x-0.5 transition" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
        <path d="M9 18l6-6-6-6" />
      </svg>
    </a>

    <a href="/gateway/quickstarts/unified-balance-evm" className="group flex items-center justify-between px-5 py-3 border-t border-[#29233B0D] dark:border-white/[0.06] no-underline hover:bg-[#0073C30A] dark:hover:bg-[#0073C315] transition-colors">
      <span className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] group-hover:text-[#29233B] dark:group-hover:text-white transition-colors">
        Unified balances
      </span>

      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" className="stroke-[#6B6580]/40 dark:stroke-[#666] group-hover:stroke-[#6B6580] dark:group-hover:stroke-[#9CA3AF] group-hover:translate-x-0.5 transition" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
        <path d="M9 18l6-6-6-6" />
      </svg>
    </a>

    <a href="/wallets/supported-blockchains" className="group flex items-center justify-between px-5 py-3 border-t border-[#29233B0D] dark:border-white/[0.06] no-underline hover:bg-[#0073C30A] dark:hover:bg-[#0073C315] transition-colors">
      <span className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] group-hover:text-[#29233B] dark:group-hover:text-white transition-colors">
        Supported blockchains
      </span>

      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" className="stroke-[#6B6580]/40 dark:stroke-[#666] group-hover:stroke-[#6B6580] dark:group-hover:stroke-[#9CA3AF] group-hover:translate-x-0.5 transition" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
        <path d="M9 18l6-6-6-6" />
      </svg>
    </a>
  </div>

  <div className="bg-white dark:bg-transparent border border-[#29233B1A] dark:border-white/[0.08] rounded-[14px] overflow-hidden">
    <div className="flex items-center gap-3 px-5 pt-5 pb-4">
      <span className="text-[16px] text-[#29233B] dark:text-white font-semibold">
        Build onchain apps
      </span>
    </div>

    <a href="/contracts/scp-deploy-smart-contract" className="group flex items-center justify-between px-5 py-3 border-t border-[#29233B0D] dark:border-white/[0.06] no-underline hover:bg-[#0073C30A] dark:hover:bg-[#0073C315] transition-colors">
      <span className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] group-hover:text-[#29233B] dark:group-hover:text-white transition-colors">
        Deploy contracts
      </span>

      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" className="stroke-[#6B6580]/40 dark:stroke-[#666] group-hover:stroke-[#6B6580] dark:group-hover:stroke-[#9CA3AF] group-hover:translate-x-0.5 transition" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
        <path d="M9 18l6-6-6-6" />
      </svg>
    </a>

    <a href="/wallets/modular" className="group flex items-center justify-between px-5 py-3 border-t border-[#29233B0D] dark:border-white/[0.06] no-underline hover:bg-[#0073C30A] dark:hover:bg-[#0073C315] transition-colors">
      <span className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] group-hover:text-[#29233B] dark:group-hover:text-white transition-colors">
        Modular wallets
      </span>

      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" className="stroke-[#6B6580]/40 dark:stroke-[#666] group-hover:stroke-[#6B6580] dark:group-hover:stroke-[#9CA3AF] group-hover:translate-x-0.5 transition" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
        <path d="M9 18l6-6-6-6" />
      </svg>
    </a>

    <a href="/wallets/gas-station" className="group flex items-center justify-between px-5 py-3 border-t border-[#29233B0D] dark:border-white/[0.06] no-underline hover:bg-[#0073C30A] dark:hover:bg-[#0073C315] transition-colors">
      <span className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] group-hover:text-[#29233B] dark:group-hover:text-white transition-colors">
        Sponsor gas fees
      </span>

      <svg width="16" height="16" viewBox="0 0 24 24" fill="none" className="stroke-[#6B6580]/40 dark:stroke-[#666] group-hover:stroke-[#6B6580] dark:group-hover:stroke-[#9CA3AF] group-hover:translate-x-0.5 transition" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
        <path d="M9 18l6-6-6-6" />
      </svg>
    </a>
  </div>
</div>

## Common tasks

<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
  <div>
    <p className="text-[11px] text-[#6B6580] dark:text-[#9CA3AF] uppercase tracking-widest mb-3 font-medium">
      Core
    </p>

    <div className="flex flex-col gap-2">
      <a href="/wallets/dev-controlled/create-your-first-wallet" className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] !no-underline !border-none hover:text-[#29233B] dark:hover:text-white transition-colors">
        Create a wallet
      </a>

      <a href="/contracts/scp-deploy-smart-contract" className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] !no-underline !border-none hover:text-[#29233B] dark:hover:text-white transition-colors">
        Deploy a contract
      </a>

      <a href="/stablecoins/quickstarts/transfer-usdc-evm" className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] !no-underline !border-none hover:text-[#29233B] dark:hover:text-white transition-colors">
        Transfer USDC
      </a>
    </div>
  </div>

  <div>
    <p className="text-[11px] text-[#6B6580] dark:text-[#9CA3AF] uppercase tracking-widest mb-3 font-medium">
      Crosschain
    </p>

    <div className="flex flex-col gap-2">
      <a href="/cctp/quickstarts/transfer-usdc-ethereum-to-arc" className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] !no-underline !border-none hover:text-[#29233B] dark:hover:text-white transition-colors">
        Bridge USDC
      </a>

      <a href="/gateway/quickstarts/unified-balance-evm" className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] !no-underline !border-none hover:text-[#29233B] dark:hover:text-white transition-colors">
        Unified balance
      </a>

      <a href="/gateway/nanopayments" className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] !no-underline !border-none hover:text-[#29233B] dark:hover:text-white transition-colors">
        Nanopayments
      </a>
    </div>
  </div>

  <div>
    <p className="text-[11px] text-[#6B6580] dark:text-[#9CA3AF] uppercase tracking-widest mb-3 font-medium">
      Payments & gas
    </p>

    <div className="flex flex-col gap-2">
      <a href="/cpn/managed-payments/quickstarts/receive-stablecoin-payins" className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] !no-underline !border-none hover:text-[#29233B] dark:hover:text-white transition-colors">
        Receive payins
      </a>

      <a href="/wallets/gas-station" className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] !no-underline !border-none hover:text-[#29233B] dark:hover:text-white transition-colors">
        Gas Station
      </a>

      <a href="/paymaster/pay-gas-fees-usdc" className="text-[14px] text-[#6B6580] dark:text-[#9CA3AF] !no-underline !border-none hover:text-[#29233B] dark:hover:text-white transition-colors">
        Pay gas with USDC
      </a>
    </div>
  </div>
</div>

<div className="grid grid-cols-1 md:grid-cols-2 gap-8 mb-8 mt-10">
  <div>
    <h2 className="text-[22px] font-semibold text-[#29233B] dark:text-white mb-4 leading-[28px]">
      Build with AI
    </h2>

    <div className="flex flex-col gap-3">
      <a href="/ai/skills" className="flex items-center gap-3 bg-white dark:bg-transparent border border-[#29233B1A] dark:border-white/10 rounded-[10px] p-4 no-underline hover:bg-[#0073C308] dark:hover:bg-[#0073C315] transition-colors">
        <div className="w-8 h-8 rounded-md bg-[#0073C3] dark:bg-[#5FBFFF] text-white dark:text-black flex items-center justify-center shrink-0">
          <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
            <path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z" />
          </svg>
        </div>

        <div>
          <span className="text-[14px] text-[#29233B] dark:text-white font-medium block">Agent Skills</span>
          <span className="text-[12px] text-[#6B6580] dark:text-[#9CA3AF]">Install guide</span>
        </div>
      </a>

      <a href="/ai/mcp" className="flex items-center gap-3 bg-white dark:bg-transparent border border-[#29233B1A] dark:border-white/10 rounded-[10px] p-4 no-underline hover:bg-[#0073C308] dark:hover:bg-[#0073C315] transition-colors">
        <div className="w-8 h-8 rounded-md bg-[#0073C3] dark:bg-[#5FBFFF] text-white dark:text-black flex items-center justify-center shrink-0">
          <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
            <rect x="4" y="4" width="16" height="16" rx="2" />

            <path d="M9 9h6v6H9z" />
          </svg>
        </div>

        <div>
          <span className="text-[14px] text-[#29233B] dark:text-white font-medium block">Circle MCP Server</span>
          <span className="text-[12px] text-[#6B6580] dark:text-[#9CA3AF]">Setup guide</span>
        </div>
      </a>

      <a href="/llms.txt" className="flex items-center gap-3 bg-white dark:bg-transparent border border-[#29233B1A] dark:border-white/10 rounded-[10px] p-4 no-underline hover:bg-[#0073C308] dark:hover:bg-[#0073C315] transition-colors">
        <div className="w-8 h-8 rounded-md bg-[#0073C3] dark:bg-[#5FBFFF] text-white dark:text-black flex items-center justify-center shrink-0">
          <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
            <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" />

            <path d="M14 2v6h6" />
          </svg>
        </div>

        <div>
          <span className="text-[14px] text-[#29233B] dark:text-white font-medium block">LLMs.txt</span>
          <span className="text-[12px] text-[#6B6580] dark:text-[#9CA3AF]">Agent context</span>
        </div>
      </a>
    </div>
  </div>

  <div>
    <h2 className="text-[22px] font-semibold text-[#29233B] dark:text-white mb-4 leading-[28px]">
      What's new
    </h2>

    <div className="flex flex-col gap-0">
      <div className="flex items-start gap-4 py-3 border-b border-[#29233B0D] dark:border-white/[0.06]">
        <span className="text-[13px] text-[#6B6580] dark:text-[#9CA3AF] shrink-0 w-[48px]">Apr 8</span>
        <span className="text-[11px] text-[#0073C3] dark:text-[#90D2FF] bg-[#0073C30D] dark:bg-[#90D2FF]/10 px-2 py-0.5 rounded font-medium shrink-0 uppercase">CPN</span>
        <span className="text-[13px] text-[#6B6580] dark:text-[#9CA3AF]">Managed Payments docs and 23 new API endpoints</span>
      </div>

      <div className="flex items-start gap-4 py-3 border-b border-[#29233B0D] dark:border-white/[0.06]">
        <span className="text-[13px] text-[#6B6580] dark:text-[#9CA3AF] shrink-0 w-[48px]">Apr 6</span>
        <span className="text-[11px] text-[#0073C3] dark:text-[#90D2FF] bg-[#0073C30D] dark:bg-[#90D2FF]/10 px-2 py-0.5 rounded font-medium shrink-0 uppercase">CCTP</span>
        <span className="text-[13px] text-[#6B6580] dark:text-[#9CA3AF]">Stellar testnet support added</span>
      </div>

      <div className="flex items-start gap-4 py-3 border-b border-[#29233B0D] dark:border-white/[0.06]">
        <span className="text-[13px] text-[#6B6580] dark:text-[#9CA3AF] shrink-0 w-[48px]">Apr 3</span>
        <span className="text-[11px] text-[#0073C3] dark:text-[#90D2FF] bg-[#0073C30D] dark:bg-[#90D2FF]/10 px-2 py-0.5 rounded font-medium shrink-0 uppercase">Mint</span>
        <span className="text-[13px] text-[#6B6580] dark:text-[#9CA3AF]">Singapore coverage for Crypto Payouts</span>
      </div>

      <div className="flex items-start gap-4 py-3 border-b border-[#29233B0D] dark:border-white/[0.06]">
        <span className="text-[13px] text-[#6B6580] dark:text-[#9CA3AF] shrink-0 w-[48px]">Apr 2</span>
        <span className="text-[11px] text-[#0073C3] dark:text-[#90D2FF] bg-[#0073C30D] dark:bg-[#90D2FF]/10 px-2 py-0.5 rounded font-medium shrink-0 uppercase">Mint</span>
        <span className="text-[13px] text-[#6B6580] dark:text-[#9CA3AF]">Continuous payment intents now default</span>
      </div>

      <div className="flex items-start gap-4 py-3 border-b border-[#29233B0D] dark:border-white/[0.06]">
        <span className="text-[13px] text-[#6B6580] dark:text-[#9CA3AF] shrink-0 w-[48px]">Apr 1</span>
        <span className="text-[11px] text-[#0073C3] dark:text-[#90D2FF] bg-[#0073C30D] dark:bg-[#90D2FF]/10 px-2 py-0.5 rounded font-medium shrink-0 uppercase">Mint</span>
        <span className="text-[13px] text-[#6B6580] dark:text-[#9CA3AF]">Credit API launched for Settlement Advance</span>
      </div>
    </div>
  </div>
</div>
