---
title: Welcome to Tabler Documentation
summary: Guides and reference for the Tabler UI kit, its plugins, Tabler Icons, Illustrations and the email templates.
description: Guides, examples and reference for Tabler UI components, plugins, icons and the other Tabler tools.
hide-pagination: true
---

import Card from '@components/DocsCard.astro'
import { Image } from 'astro:assets'
import coverLight from '../images/cover-docs.png'
import coverDark from '../images/cover-docs-dark.png'

<Image src={coverLight} alt="Tabler" class="mb-4 hide-theme-dark border-0" width={710} densities={[1, 2]} loading="eager" />
<Image src={coverDark} alt="Tabler" class="mb-4 hide-theme-light border-0" width={710} densities={[1, 2]} loading="eager" />

This is the documentation for Tabler and the tools around it: the UI kit, its plugins, Tabler Icons, Illustrations and the email templates. Pick a section below to get started.

<div class="mt-6 pt-6">
  <div class="row row-deck row-cards">
    <Card title="UI Components" href="/ui" icon="paint" description="Free and open source web application UI kit based on Bootstrap" />
    <Card title="Plugins" href="/ui/plugins" icon="plug" description="Free and open source plugins for Tabler UI components" />
    <Card title="Icons" href="/icons" icon="ghost" description="Pixel-perfect icons for web design and development" />
    <Card title="Illustrations" href="/illustrations" icon="brand-figma" description="Customizable SVG illustrations for your web project" />
    <Card title="Email Templates" href="/emails" icon="mail" description="Responsive email templates ready to use in your marketing campaigns" />
  </div>
</div>