Shadcn Data Table
Elevate your UI with a growing collection of 13 Shadcn data table components, built using React and Tailwind CSS.
Built using TanStack Table. For detailed instructions, please refer to this documentation.
| Name | Status | Amount | ||
|---|---|---|---|---|
Shang Chain | success | shang07@yahoo.com | $699.00 | |
Kevin Lincoln | success | kevinli09@gmail.com | $242.00 | |
Milton Rose | processing | rose96@gmail.com | $655.00 | |
Silas Ryan | success | silas22@gmail.com | $874.00 | |
Ben Tenison | failed | bent@hotmail.com | $541.00 |
Default data table
| Name | Status | Amount | ||
|---|---|---|---|---|
Shang Chain | success | shang07@yahoo.com | $699.00 | |
Kevin Lincoln | success | kevinli09@gmail.com | $242.00 | |
Milton Rose | processing | rose96@gmail.com | $655.00 | |
Silas Ryan | success | silas22@gmail.com | $874.00 | |
Ben Tenison | failed | bent@hotmail.com | $541.00 |
Density data table Shadcn UI Blocks
| Name | Status | Amount | ||
|---|---|---|---|---|
Shang Chain | success | shang07@yahoo.com | $699.00 | |
Kevin Lincoln | success | kevinli09@gmail.com | $242.00 | |
Milton Rose | processing | rose96@gmail.com | $655.00 | |
Silas Ryan | success | silas22@gmail.com | $874.00 | |
Ben Tenison | failed | bent@hotmail.com | $541.00 |
Data table column visibility
| Product | Price | Availability | Rating | |
|---|---|---|---|---|
BC Black Chair | $159 | In Stock | 3.9 | |
NJ Nike Jordan | $599 | Limited | 4.4 | |
O7P OnePlus 7 Pro | $1299 | Out of Stock | 3.5 | |
NS Nintendo Switch | $499 | In Stock | 4.9 | |
AMM Apple magic mouse | $970 | Limited | 4.1 | |
AW Apple watch | $1500 | Limited | 3.1 | |
CGS Casio G-Shock | $194 | Out of Stock | 1.5 | |
RBS RayBan Sunglasses | $199 | Out of Stock | 2.4 |
Data table with column filter
Name | Status | Email | Amount | |
|---|---|---|---|---|
Shang Chain | success | shang07@yahoo.com | $699.00 | |
Kevin Lincoln | success | kevinli09@gmail.com | $242.00 | |
Milton Rose | processing | rose96@gmail.com | $655.00 | |
Silas Ryan | success | silas22@gmail.com | $874.00 | |
Ben Tenison | failed | bent@hotmail.com | $541.00 |
Data table with sortable column
Name | Status | Email | Amount | Due Date |
|---|---|---|---|---|
Shang Chain | success | shang07@yahoo.com | $699.00 | 2023-10-01 |
Kevin Lincoln | success | kevinli09@gmail.com | $242.00 | 2023-10-01 |
Milton Rose | processing | rose96@gmail.com | $655.00 | 2023-10-01 |
Silas Ryan | success | silas22@gmail.com | $874.00 | 2023-10-01 |
Ben Tenison | failed | bent@hotmail.com | $541.00 | 2023-10-01 |
Data table with resizable columns
Product Name | Category | Stock Quantity | Price | Supplier | Discontinued |
|---|---|---|---|---|---|
Apple iPhone 14 | Smartphones | 4550 | $1,500.00 | Dixon Electronics | no |
Metal frame table | Furniture | 150 | $540.00 | Milton Furniture | no |
Xiaomi A series | electronics | 1500 | $2,200.00 | Xiaomi Electronics | yes |
RC Monster Truck | Toys | 10500 | $250.00 | Lego Toys | no |
Glass Water Bottle | Kitchenware | 5503 | $69.00 | Kitchen Essentials | no |
BenQ Monitor 24 | Electronics | 600 | $1,000.00 | BenQ Electronics | yes |
Data table with pinnable columns
First Name | Last Name | Job Title | Department | Date of Birth | Hire Date | Salary |
|---|---|---|---|---|---|---|
John | Doe | Software Engineer | Engineering | 1990-01-01 | 2020-01-15 | $80,000.00 |
Jane | Smith | Product Manager | Product | 1985-05-20 | 2019-03-10 | $95,000.00 |
Alice | Johnson | UX Designer | Design | 1992-07-30 | 2021-06-01 | $70,000.00 |
Bob | Brown | Data Analyst | Analytics | 1988-11-15 | 2018-09-20 | $75,000.00 |
Data table with draggable columns
| Team Name | Department | Location | Next Milestone | Budget | ||
|---|---|---|---|---|---|---|
Digital Marketing | Marketing | London | Launch New Campaign | $30,000.00 | ||
Product Development | Engineering | San Francisco | Release Version 2.0 | $50,000.00 | ||
Sales Team | Sales | New York | Close Q3 Deals | $40,000.00 |
Data table with expanding sub-rows made
Product Name | Price | Availability | |
|---|---|---|---|
| No results. | |||
1-0 of 0
Paginated data table
| Name | Status | Amount | ||
|---|---|---|---|---|
Shang Chain | success | shang07@yahoo.com | $699.00 | |
Kevin Lincoln | success | kevinli09@gmail.com | $242.00 | |
Milton Rose | processing | rose96@gmail.com | $655.00 | |
Silas Ryan | success | silas22@gmail.com | $874.00 | |
Ben Tenison | failed | bent@hotmail.com | $541.00 | |
Alice Cooper | processing | alice@email.com | $321.00 | |
Bob Johnson | success | bob.j@company.com | $789.00 | |
Carol Williams | processing | carol.w@domain.org | $456.00 |
Data table with export functionality (CSV, Excel, JSON)
First Name | Last Name | Email | Status | Progress | |
|---|---|---|---|---|---|
% | |||||
% | |||||
% | |||||
% | |||||
% |
5 rows total
Editable data table - Click on cells to edit values