Docs | Athen

<a href="/guide/getting-started" target="" class="at-link cursor-pointer " data-hk="10">Guide</a>

<div class="relative h-60px flex items-center" data-hk="14"><button class="flex items-center gap-4px b-x-2 text-1 text-sm font-medium transition-color duration-200 hover:text-text-2" data-hk="15">v0.0.8-beta.8<span class="i-carbon-chevron-down" height="18" width="18"></span></button><div style="opacity:0;visibility:hidden" class="absolute left-[-60px] top-14 mx-0.8 transition-opacity duration-300" data-hk="16"><div class="z-100 mr-[1.5rem] h-full max-h-100vh min-w-100px w-full overflow-y-auto b-1 b-border-default rounded-xl b-solid bg-bg-default p-3 shadow-[var(--at-shadow-3)]" data-hk="17"><div class="font-medium" data-hk="18"><a href="https://github.com/estjs/athen/blob/master/CHANGELOG.md" target="_blank" rel="noopener noreferrer" class="at-link cursor-pointer " data-hk="19">&lt;div class=&quot;rounded-md py-1.6 pl-3 hover:bg-bg-mute&quot; data-hk=&quot;20&quot;&gt;&lt;div class=&quot;flex items-center&quot; data-hk=&quot;21&quot;&gt;&lt;span class=&quot;mr-1&quot; data-hk=&quot;22&quot;&gt;Changelog&lt;/span&gt;&lt;div class=&quot;ml-1 text-text-3&quot;&gt;&lt;span class=&quot;i-carbon-arrow-up-right h-18 w-18&quot;&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;</a></div></div></div></div>

<div class="menu-item-before menu-item-after flex items-center text-sm font-bold" data-hk="24"><div class="relative h-60px flex items-center" data-hk="25"><button class="flex items-center gap-4px b-x-2 text-1 text-sm font-medium transition-color duration-200 hover:text-text-2" data-hk="26"><span class="i-carbon-translate" height="18" width="18" data-hk="27"></span><span class="i-carbon-chevron-down" height="18" width="18"></span></button><div style="opacity:0;visibility:hidden" class="absolute left-[-60px] top-14 mx-0.8 transition-opacity duration-300" data-hk="28"><div class="z-100 mr-[1.5rem] h-full max-h-100vh min-w-100px w-full overflow-y-auto b-1 b-border-default rounded-xl b-solid bg-bg-default p-3 shadow-[var(--at-shadow-3)]" data-hk="29"><div class="rounded-md py-1.6 pl-3" data-hk="30"><span class="mr-1 text-brand" data-hk="31">English</span></div><div class="font-medium" data-hk="32"><a href="/zh/" class="at-link cursor-pointer" data-hk="33"><div class="rounded-md py-1.6 pl-3 hover:bg-bg-mute" data-hk="34"><div class="flex items-center" data-hk="35"><span class="mr-1" data-hk="36">简体中文</span><div class="ml-1 text-text-3"><span class="i-carbon-arrow-up-right h-18 w-18"></span></div></div></div></a></div></div></div></div></div>

<div data-hk="46"><div class="mx-auto px-10 pb-16 pt-20" data-hk="47"><div class="mx-auto max-w-screen-xl flex justify-between" data-hk="48"><div class="max-w-xl flex flex-1 flex-col text-left" data-hk="49"><h1 class="max-w-3xl text-6xl font-bold" data-hk="50"><span class="bg-[--at-home-hero-name-background] bg-clip-text text-transparent" data-hk="51">athen</span></h1><p class="max-w-3xl text-6xl font-bold" data-hk="52">Documentation framework based on Vite & Essor</p><p class="max-w-3xl whitespace-pre-wrap pt-3 text-2xl text-gray-500 font-medium" data-hk="53"></p><div class="flex flex-wrap justify-start pt-8" data-hk="54"><div key="/guide/getting-started" class="p-1" data-hk="55"><a href="/guide/getting-started" target="" class="at-link cursor-pointer at-button medium brand" data-hk="56">&lt;span data-hk=&quot;57&quot;&gt;Get Started&lt;/span&gt;</a></div><div key="https://github.com/estjs/athen" class="p-1" data-hk="58"><a href="https://github.com/estjs/athen" target="_blank" rel="noopener noreferrer" class="at-link cursor-pointer at-button medium brand" data-hk="59">&lt;span data-hk=&quot;60&quot;&gt;View on GitHub&lt;/span&gt;</a></div></div></div><div class="mx-auto h-270px flex justify-center" data-hk="61"><img src="/logo.svg" alt="athen" class="w-full" data-hk="62"/></div></div></div><div class="grid grid-cols-3 mx-auto max-w-screen-xl gap-10px" data-hk="63"><div class="rounded-md p-3" data-hk="64"><article class="h-full border b-border-default rounded-xl border-solid p-6" data-hk="65"><div class="mb-5 h-12 w-12 flex items-center justify-center border rounded-md bg-gray-100 text-3xl dark:bg-white" data-hk="66">🚀</div><h2 class="font-bold" data-hk="67">Vite: Lightning-fast Development Response</h2><p class="pt-2 text-sm text-gray-500 font-medium leading-6" data-hk="68">Built on Vite, the development response is incredibly fast, with instant hot updates, providing you with an ultimate development experience.</p></article></div><div class="rounded-md p-3" data-hk="69"><article class="h-full border b-border-default rounded-xl border-solid p-6" data-hk="70"><div class="mb-5 h-12 w-12 flex items-center justify-center border rounded-md bg-gray-100 text-3xl dark:bg-white" data-hk="71">📦</div><h2 class="font-bold" data-hk="72">MDX: Markdown &amp; Essor Components for Content Writing</h2><p class="pt-2 text-sm text-gray-500 font-medium leading-6" data-hk="73">MDX is a powerful way to write content. You can use Essor components within Markdown.</p></article></div><div class="rounded-md p-3" data-hk="74"><article class="h-full border b-border-default rounded-xl border-solid p-6" data-hk="75"><div class="mb-5 h-12 w-12 flex items-center justify-center border rounded-md bg-gray-100 text-3xl dark:bg-white" data-hk="76">🛠️</div><h2 class="font-bold" data-hk="77">Feature-rich: One-stop Solution</h2><p class="pt-2 text-sm text-gray-500 font-medium leading-6" data-hk="78">Common features such as full-text search and internationalization are ready to use out of the box.</p></article></div></div><footer class="b-1 b-border-default b-t-solid text-center text-14px text-text-2 font-500" data-hk="79"><p data-hk="80">Released under the MIT License.</p><p data-hk="81">Copyright © 2023-present estjs</p></footer></div>