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

# Introduction

> Découvrez la nouvelle génération de documentation. Native à l’IA, magnifique dès le départ et conçue pour les développeurs.

export const HeroCard = ({filename, title, description, href}) => {
  return <a className="group cursor-pointer pb-8" href={href}>
      <img src={`https://raw.githubusercontent.com/mintlify/docs/refs/heads/main/images/hero/${filename}.png`} className="block dark:hidden pointer-events-none group-hover:scale-105 transition-all duration-100" />
      <img src={`https://raw.githubusercontent.com/mintlify/docs/refs/heads/main/images/hero/${filename}-dark.png`} className="pointer-events-none group-hover:scale-105 transition-all duration-100 hidden dark:block" />
      <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/hfh-d7a4d643-mintlify-d7bc03a0/UpOCiqQX4ISGMxkm/images/hero/background-light.svg?fit=max&auto=format&n=UpOCiqQX4ISGMxkm&q=85&s=c7a6f86e7a5a32125e263ff53f14ca52" className="block dark:hidden pointer-events-none w-full h-auto" alt="Image d’arrière-plan décorative." width="1152" height="388" data-path="images/hero/background-light.svg" />

    <img src="https://mintcdn.com/hfh-d7a4d643-mintlify-d7bc03a0/UpOCiqQX4ISGMxkm/images/hero/background-dark.svg?fit=max&auto=format&n=UpOCiqQX4ISGMxkm&q=85&s=382e754506ae5fb3e8cfb918cbae8d3d" className="hidden dark:block pointer-events-none w-full h-auto" alt="Image d’arrière-plan décorative." width="1152" height="388" data-path="images/hero/background-dark.svg" />
  </div>

  <div className="relative z-10 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">
      Documentation
    </h1>

    <div className="max-w-xl mx-auto px-4 mt-4 text-lg text-center text-gray-500 dark:text-zinc-500">
      Découvrez la nouvelle génération de documentation : nativement basée sur l’IA, élégante par défaut et conçue pour les développeurs et leurs équipes.
    </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="Démarrage rapide" description="Déployez votre premier site de documentation en quelques minutes grâce à notre guide pas à pas" href="/docs/fr/quickstart" />

      <HeroCard filename="cli" title="Installation de la CLI" description="Installez l’interface en ligne de commande (CLI) pour prévisualiser et développer votre documentation en local" href="/docs/fr/cli" />

      <HeroCard filename="editor" title="Éditeur web" description="Effectuez rapidement des mises à jour et gérez le contenu avec notre éditeur accessible depuis le navigateur" href="/docs/fr/editor/index" />

      <HeroCard filename="components" title="Composants" description="Créez une documentation riche et interactive avec nos composants prêts à l’emploi" href="/docs/fr/components/accordions" />
    </div>
  </div>
</div>