# templui Components

> templ-based UI components for Go. Open source. Customizable. Accessible.

## Overview

templui is a collection of beautifully designed, accessible UI components built with templ and Go.
Components are designed to be composable, customizable, and easy to integrate into your Go projects.

- [Introduction](https://templui.io/docs/introduction): Core principles and getting started guide
- [How to Use](https://templui.io/docs/how-to-use): CLI installation and usage guide
- [Components](https://templui.io/docs/components): Component overview and catalog
- [Themes](https://templui.io/docs/themes): Theme customization and styling
- [GitHub](https://github.com/templui/templui): Source code and issue tracker

## Form & Input

- [Button](https://templui.io/docs/components/button): Button component with multiple variants.
- [Calendar](https://templui.io/docs/components/calendar): Calendar component for date selection.
- [Checkbox](https://templui.io/docs/components/checkbox): Checkbox input component.
- [Date Picker](https://templui.io/docs/components/date-picker): Date picker component combining input and calendar.
- [Form](https://templui.io/docs/components/form): Form container with validation support.
- [Input](https://templui.io/docs/components/input): Text input component.
- [Input OTP](https://templui.io/docs/components/input-otp): One-time password input component.
- [Label](https://templui.io/docs/components/label): Form label component.
- [Radio](https://templui.io/docs/components/radio): Radio button group component.
- [Rating](https://templui.io/docs/components/rating): Star rating input component.
- [Select Box](https://templui.io/docs/components/select-box): Searchable select component.
- [Slider](https://templui.io/docs/components/slider): Slider input component.
- [Switch](https://templui.io/docs/components/switch): Toggle switch component.
- [Tags Input](https://templui.io/docs/components/tags-input): Tags input component.
- [Textarea](https://templui.io/docs/components/textarea): Multi-line text input component.
- [Time Picker](https://templui.io/docs/components/time-picker): Time picker component.

## Layout & Navigation

- [Accordion](https://templui.io/docs/components/accordion): Collapsible accordion component.
- [Breadcrumb](https://templui.io/docs/components/breadcrumb): Breadcrumb navigation component.
- [Pagination](https://templui.io/docs/components/pagination): Pagination component for lists and tables.
- [Separator](https://templui.io/docs/components/separator): Visual divider between content sections.
- [Sidebar](https://templui.io/docs/components/sidebar): Collapsible sidebar component for app layouts.
- [Tabs](https://templui.io/docs/components/tabs): Tabbed interface component.

## Overlays & Dialogs

- [Dialog](https://templui.io/docs/components/dialog): Modal dialog component.
- [Dropdown](https://templui.io/docs/components/dropdown): Dropdown menu component.
- [Popover](https://templui.io/docs/components/popover): Floating popover component.
- [Sheet](https://templui.io/docs/components/sheet): Slide-out panel component (drawer).
- [Tooltip](https://templui.io/docs/components/tooltip): Tooltip component for additional context.

## Feedback & Status

- [Alert](https://templui.io/docs/components/alert): Alert component for messages and notifications.
- [Badge](https://templui.io/docs/components/badge): Badge component for labels and status indicators.
- [Progress](https://templui.io/docs/components/progress): Progress bar component.
- [Skeleton](https://templui.io/docs/components/skeleton): Skeleton loading placeholder.
- [Toast](https://templui.io/docs/components/toast): Toast notification component.

## Display & Media

- [Aspect Ratio](https://templui.io/docs/components/aspect-ratio): Container that maintains aspect ratio.
- [Avatar](https://templui.io/docs/components/avatar): Avatar component for user profiles.
- [Card](https://templui.io/docs/components/card): Card container component.
- [Carousel](https://templui.io/docs/components/carousel): Carousel component with navigation controls.
- [Charts](https://templui.io/docs/components/charts): Chart components for data visualization.
- [Table](https://templui.io/docs/components/table): Table component for displaying data.

## Misc

- [Code](https://templui.io/docs/components/code): Syntax-highlighted code block component.
- [Collapsible](https://templui.io/docs/components/collapsible): Collapsible container component.
- [Copy Button](https://templui.io/docs/components/copy-button): Copy to clipboard button component.
- [Icon](https://templui.io/docs/components/icon): SVG icon component library.