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

# Welcome to Full Sail

> The next generation decentralized exchange.

export const HeroCard = ({ filename, title, description, href }) => {
  // Map for light mode images (swapped)
  const lightModeMap = { '1': '4', '2': '1', '3': '3', '4': '2' };
  // Map for dark mode images (original + 4)
  const darkModeMap = { '1': '5', '2': '6', '3': '7', '4': '8' };
  
  const lightFilename = lightModeMap[filename];
  const darkFilename = darkModeMap[filename];
  
  return (
    <a className="group cursor-pointer pb-8" href={href}>
      <img
        src={`/images/landing/${lightFilename}.png`}
        className="block dark:hidden pointer-events-none group-hover:scale-105 transition-all duration-100 rounded-lg shadow-lg"
      />
      <img
        src={`/images/landing/${darkFilename}.png`}
        className="hidden dark:block pointer-events-none group-hover:scale-105 transition-all duration-100 rounded-lg shadow-lg"
      />
      <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="px-4 py-16 lg:py-48 lg:pb-24 max-w-3xl mx-auto">
  <h1 className="block text-4xl font-medium text-center text-gray-900 dark:text-zinc-50 tracking-tight">
    Full Sail Documentation
  </h1>

  <div className="max-w-xl mx-auto px-4 mt-4 text-lg text-center text-gray-500 dark:text-zinc-500">
    The most efficient decentralized exchange on Sui. Trade with concentrated liquidity, dynamic fees, and earn through predictive governance.
  </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="1" title="Get Started" description="Start trading and earning on Full Sail in seconds" href="/introduction/quickstart" />

    <HeroCard filename="4" title="Trading" description="Swap tokens with deep liquidity and dynamic fees" href="/tutorials/trading" />

    <HeroCard filename="3" title="Developers" description="Explore Full Sail's contracts, liquidity pools and bug bounty - start building" href="/developers" />

    <HeroCard filename="2" title="How Full Sail Works" description="Learn about ve(4,4), ROE, and predictive governance" href="/exchange/how-fullsail-works" />
  </div>
</div>