A chat bubble component with no external dependencies
Progress Bar
A component that visually represents the completion status of a task or operation as it moves towards completion.
Two Column Grid
A simple two column grid with inputs on the left and outputs on the right based on fasthtml-example form demo
Visualizations
SVG plot
Interactive Seaborn SVG plot by Li (Lily) Cai
Bloch Sphere
Interactive Bloch sphere visualization using the fh-plotly plugin by Carlo Lepelaars
Plotly Interactive Charts
Interactive Plotly chart using the fh-plotly plugin by Carlo Lepelaars that lets you zoom, pan, hover over data points and much more
Great-Tables Tables
Change the appearance of a Polars dataFrame based on selected colors using the Great Tables library.
Altair Charts
Interactive altair chart using the fh-altair plugin by Vincent D. Warmerdam
Matplotlib Charts
Interactive matplotlib chart using the fh-matplotlib plugin by Vincent D. Warmerdam
Dynamic User Interface
Infinite Scroll
A table with infinite scroll over a large dataset (appending rows to the table as the user reaches the end of the table).
Web Sockets
A demonstration on web sockets to have a multi-user messaging/chat use
Inline Field Validation
A form with inline field validation on individual inputs with the submit aditionally validating the whole form.
Cascading Dropdowns
A cascading dropdown component where values in second dropdown are dependent on the value in the first dropdown
Click to Edit
A click to edit text component built based on a htmx documentation example.
Svg
In band replacement
A component that shows how to do an inband swap of an SVG element
Find and click
The component shows a circle which can be clicked. The first click starts a timer and after 10 clicks the elasped time is reported. Each click causes the circle to move.
Click and Drag
A component that shows a rectangle which can be dragged with the mouse
Start Simple
CSV Editor
An app to upload csv files, edit in browser, and then download the updated file
Minimal Todo App (SQLite)
A minimal todo app using SQLite backend.
Applications
Text-Annotator
An app built by Alex Volkov that demonstrates annotation use-cases and tailwind styling in FastHTML
Tic-Tac-Toe
A Tic Tac Toe game using FastHTML and Tailwind CSS by by Adedara Adeloro