Skip to content

Component Index

Faststrap currently registers 152 UI components across forms, display, feedback, navigation, layout, and patterns. Use this page as a scan-friendly map before reaching for custom HTML.

Discovery API

You can also inspect components programmatically with list_components(), find_components(), and list_component_metadata(). See the Component Registry.

Forms

Component Docs Notes
Button Button Standard actions, links, loading states.
ButtonGroup, ButtonToolbar ButtonGroup Grouped button controls.
CalendarDatePicker CalendarDatePicker Single native date picker.
Checkbox, Radio, Switch, CloseButton Checkbox & Switch Boolean controls and close button helper.
DateRangePicker DateRangePicker Start/end date filter.
ExportButton ExportButton Export links and POST forms.
FileInput FileInput File upload control.
FilterBar FilterBar Dashboard/filter composition.
FloatingActionButton, GradientButton Action Buttons Opinionated premium action buttons.
FloatingLabel FloatingLabel Bootstrap floating labels.
FormBuilder Form Builder Pydantic v2 form generation.
FormSection FormSection Grouped form sections with headings and actions.
FormErrorSummary, FormGroup, FormGroupFromErrors FormGroup Validation and grouped field rendering.
FormWizard, WizardStep FormWizard Multi-step form flow.
InlineEditor InlineEditor HTMX-friendly inline editing.
Input Input Text inputs and textareas.
InputGroup, InputGroupText InputGroup Appended/prepended input content.
LiveValidationField, ValidationMessage Live Validation HTMX live validation helpers.
MultiSelect MultiSelect Native multi-select.
Range Checkbox & Switch Basic range input.
RangeSlider RangeSlider Single/dual range slider.
SearchableSelect SearchableSelect Server-side searchable select.
Select Select Native select control.
ThemeToggle ThemeToggle Dark/light theme control.
ToggleGroup ToggleGroup Toggle button groups.

Display

Component Docs Notes
Avatar, AvatarGroup Avatar People/team identity surfaces.
Badge, BadgeGroup Badge Labels, pills, and grouped badges.
Card Card Base content surface.
Carousel, CarouselItem Carousel Bootstrap slideshow.
Chart Chart Matplotlib, Plotly, Altair, SVG/HTML wrapper.
CodeBlock, JsonViewer, KeyValueList, RecordDetail Structured Display Data/dev-app primitives for code, JSON, and records.
DataTable DataTable Search, sort, pagination, server-side table flows.
EmptyState Empty State Empty data placeholders.
Figure Figure Images with captions.
FlipCard, GlowCard, RevealCard, TiltCard Visual Cards CSS-only premium visual cards.
Image Image Responsive image utilities.
KPICard KPI Card Multiple metrics in one card.
MapView MapView Optional Leaflet map.
Markdown Markdown Optional sanitized Markdown rendering.
Mermaid Mermaid Mermaid diagram container.
MetricCard Metric Card Single metric with delta.
ResultCard Result Card Success/error/result feedback surface.
SSETarget SSETarget Server-sent event target.
Sheet Sheet Mobile bottom sheet over Drawer.
StatCard Stat Card Dashboard stat card.
StatusBadge StatusBadge Status-aware badge.
Stepper, StepperStep Stepper Step progress UI.
Svg SVG Sanitized SVG renderer.
Table, THead, TBody, TRow, TCell Table Static tables and aliases.
TextClamp TextClamp Expandable long text preview.
Timeline, TimelineItem Timeline Chronological events.
TrendCard Trend Card Metric with sparkline slot.

Feedback

Component Docs Notes
Alert, NoticeAlert Alert Inline feedback and notices.
ConfirmAction, ConfirmDialog Modal Destructive confirmations.
ErrorDialog Error Dialog Recoverable modal errors.
ErrorPage Error Page Full-page error states.
ErrorToast, InfoToast, NoticeToast, SuccessToast, WarningToast Notification Presets Toast/alert presets.
InstallPrompt Install Prompt PWA install guidance.
Modal Modal Bootstrap modal wrapper.
ModernToast, ModernToastStack ModernToast Opinionated polished toast surface.
NotificationCenter Notification Center Dropdown notification hub.
Placeholder, PlaceholderButton, PlaceholderCard Placeholder Skeleton loading placeholders.
Popover, Tooltip Tooltip & Popover Bootstrap overlays.
Progress, ProgressBar Progress Progress indicators.
DotsLoader, RingLoader, WaveLoader, PulseLoader, PolygonLoader, TypewriterLoader, ShadowLoader, ProgressRing CSS Loaders Additional CSS-only loading indicators.
SimpleToast, Toast, ToastContainer Toast Bootstrap toasts.
Spinner Spinner Loading spinners.
Component Docs Notes
Accordion, AccordionItem Accordion Expand/collapse content groups.
BottomNav, BottomNavItem BottomNav Mobile bottom navigation.
Breadcrumb Breadcrumb Page hierarchy.
Collapse Collapse Collapsible content.
CommandPalette, CommandItem CommandPalette Command menu surface.
Drawer Drawer Offcanvas drawer.
Dropdown, DropdownItem, DropdownDivider Dropdown Menus and split buttons.
GlassNavbar, GlassNavItem GlassNavbar Glassmorphism navbar.
ListGroup, ListGroupItem ListGroup List navigation/content.
Navbar Navbar Standard Bootstrap navbar.
Pagination Pagination Page navigation.
Scrollspy Scrollspy Scroll-linked nav.
SidebarNavbar, SidebarNavItem SidebarNavbar Dashboard sidebar navigation.
Tabs, TabPane Tabs Tabbed interfaces.

Layout And Patterns

Component Docs Notes
Col, Container, Row Grid Bootstrap layout primitives.
Stack, Cluster, Center Layout Primitives Common flexbox compositions without custom utility strings.
DashboardGrid DashboardGrid Responsive dashboard grids.
Hero Hero Landing hero sections.
PageHeader PageHeader Page title, subtitle, status, and action row.
ParallaxSection ParallaxSection CSS-only background image section.
Feature, FeatureGrid Feature Grid Feature sections.
FooterModern Footer Modern Marketing footer.
NavbarModern Navbar Modern Premium navbar pattern.
PricingTier, PricingGroup Pricing SaaS pricing sections.
Testimonial, TestimonialSection Testimonial Section Social proof sections.