Source code
Click to see the source code for this component on GitHub. Feel free to copy it and adjust it for your own use.
Installation
Usage
Basic example
| Invoice | Status | Method | Amount |
|---|---|---|---|
| INV001 | Pending | Bank Transfer | $656.04 |
| INV002 | Paid | Bank Transfer | $584.95 |
| INV003 | Pending | Bank Transfer | $504.15 |
| INV004 | Paid | PayPal | $175.05 |
| INV005 | Paid | Credit Card | $829.35 |
| INV006 | Pending | Credit Card | $306.29 |
| INV007 | Pending | PayPal | $831.23 |
| Total | $3,887.06 | ||
Simple
Users
A list of all the users in your account including their name, title, email and role.
| Name | Title | Role | Actions | |
|---|---|---|---|---|
| Jan West | Future Program Specialist | jan_west@yahoo.com | Admin | |
| Deion Brakus | Direct Markets Officer | deion.brakus35@hotmail.com | Admin | |
| Vella Gutkowski | Human Implementation Administrator | vella_gutkowski@hotmail.com | Viewer | |
| Torrance Mitchell | District Usability Executive | torrance_mitchell@gmail.com | Viewer | |
| Devan Considine | Corporate Applications Assistant | devan_considine@yahoo.com | Viewer | |
| Walton Hettinger | Central Applications Supervisor | walton.hettinger62@hotmail.com | Viewer |
Stacked on mobile
Users
A list of all the users in your account including their name, title, email and role.
| Name | Role | Actions |
|---|---|---|
Deven Carter Central Operations Associate deven_carter71@hotmail.com | Admin | |
Krystal Skiles Central Division Specialist krystal_skiles@gmail.com | Member | |
Saul Halvorson Senior Communications Producer saul_halvorson@hotmail.com | Admin | |
Lewis Barton District Data Consultant lewis.barton@yahoo.com | Admin | |
Otto Swaniawski Principal Web Coordinator otto.swaniawski28@yahoo.com | Viewer | |
Walton Wyman National Response Representative walton_wyman13@gmail.com | Member |
Sticky header
Users
A list of all the users in your account including their name, title, email and role.
| Name | Role | Actions |
|---|---|---|
Vanessa Collier Legacy Quality Planner vanessa.collier78@gmail.com | Admin | |
Josephine Goldner Principal Intranet Strategist josephine.goldner@yahoo.com | Admin | |
Drew Marquardt Internal Interactions Officer drew.marquardt82@yahoo.com | Viewer | |
Lizeth Weimann Corporate Creative Agent lizeth.weimann28@hotmail.com | Viewer | |
Meta Cremin District Security Designer meta_cremin@gmail.com | Viewer | |
Sammy Marquardt Corporate Creative Manager sammy.marquardt52@gmail.com | Admin | |
Deontae Hills Human Markets Facilitator deontae.hills@gmail.com | Viewer | |
Jordane Koss Central Group Technician jordane_koss88@gmail.com | Admin | |
Brianne Stark Senior Implementation Strategist brianne_stark@hotmail.com | Admin | |
Quincy Fadel National Security Developer quincy_fadel@hotmail.com | Member | |
Janis Bechtelar Chief Quality Coordinator janis.bechtelar@gmail.com | Member | |
Orin Erdman Chief Web Supervisor orin_erdman@yahoo.com | Admin | |
Viviane Paucek Principal Solutions Developer viviane_paucek36@hotmail.com | Member | |
Nels Schulist Senior Quality Facilitator nels_schulist42@yahoo.com | Viewer | |
Heber Nienow Direct Identity Supervisor heber_nienow@gmail.com | Admin | |
Ramiro Kihn International Assurance Facilitator ramiro.kihn22@hotmail.com | Member | |
Vance Bruen Future Optimization Designer vance_bruen37@yahoo.com | Viewer | |
Morris Anderson International Accounts Director morris.anderson@hotmail.com | Admin | |
Kane Parisian-Kuphal International Directives Supervisor kane.parisian-kuphal@yahoo.com | Member | |
Odie Kutch National Metrics Liaison odie_kutch4@yahoo.com | Admin |
Origin UI Examples
These are some examples that I found today over here Origin UI ❤️. I think they are cool.
To use these examples you will have to copy the code and adjust it for your own use.
Basic Table
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Donnie Ernser | melyssa_wyman85@yahoo.com | Walkerbury | Inactive | $1,040.92 |
| Terry Purdy | may.donnelly38@yahoo.com | New Mustafa | Active | $1,007.81 |
| Judy Mayert | earnestine5@gmail.com | Lavadaville | Active | $403.21 |
| Percy Bechtelar | eliezer28@hotmail.com | Fort Christyfurt | Inactive | $233.43 |
| Iris Lind | fabian.carter52@gmail.com | Carson City | Inactive | $1,081.02 |
| Total | $3,766.39 | |||
Basic table
Table with Images
| Name | Location | Status | Balance | |
|---|---|---|---|---|
Randall Schinner @jared_rath | noe.bechtelar53@gmail.com | North Trystan | Inactive | $256.01 |
Stewart Keebler-Botsford @weldon_mcclure65 | kellie.reichel@yahoo.com | Farrellberg | Active | $927.15 |
Tyrone Miller @aron_lemke92 | claude.bailey37@gmail.com | North Mohamedcester | Active | $417.83 |
Patti Hermiston-Quitzon @dominic32 | kylie82@hotmail.com | North Dellside | Active | $26.51 |
Julia Greenfelder @haskell74 | ambrose_ebert41@gmail.com | West Baileyfurt | Inactive | $310.14 |
Table with images
Table No Horizontal Lines
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Miss Sonia Luettgen | luz.weber62@hotmail.com | Walterview | Active | $499.37 |
| Renee Barrows | celine.terry@gmail.com | South Geoffreyside | Inactive | $643.51 |
| Brittany Langworth | blake_stokes@gmail.com | Dubuque | Active | $51.21 |
| Omar Bogan | minerva23@gmail.com | New Priscillafurt | Active | $43.55 |
| Johnnie Feeney DDS | lucile40@yahoo.com | Rebekatown | Inactive | $803.78 |
| Total | $2,041.42 | |||
Table without horizontal dividers
Striped Tabled
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Patrick Klein | orlando_dubuque58@gmail.com | Feilborough | Active | $941.81 |
| Oliver Erdman | sandrine_purdy-simonis@yahoo.com | Kayleefield | Active | $6.84 |
| Ms. Ann Jerde | brandy_fahey93@gmail.com | Edina | Active | $229.60 |
| Leticia Towne | keon_waelchi97@hotmail.com | Port Mollyshire | Active | $214.19 |
| Owen Jacobs | alysson.baumbach@gmail.com | Handfield | Inactive | $959.74 |
| Total | $2,352.18 | |||
Striped table
Vertical Lines
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Jenny Buckridge | hillard_cronin25@yahoo.com | North Fatima | Inactive | $751.60 |
| Abel Wiegand | garnett.roob@gmail.com | New Koby | Inactive | $663.46 |
| Kellie Jacobi | marquis76@yahoo.com | East Abbie | Inactive | $613.18 |
| Joel Daugherty DVM | mossie36@yahoo.com | Port Milfordside | Inactive | $24.72 |
| Brent Kohler | rosella_schinner@yahoo.com | Smithfield | Inactive | $291.91 |
| Total | $2,344.87 | |||
Table with vertical lines
Dense Table
| Name | Release Year | Developer | Typing | Paradigm | Extension | Latest Version | Popularity |
|---|---|---|---|---|---|---|---|
| JavaScript | 1995 | Brendan Eich | Dynamic | Multi-paradigm | .js | ES2021 | High |
| Python | 1991 | Guido van Rossum | Dynamic | Multi-paradigm | .py | 3.10 | High |
| Java | 1995 | James Gosling | Static | Object-oriented | .java | 17 | High |
| C++ | 1985 | Bjarne Stroustrup | Static | Multi-paradigm | .cpp | C++20 | High |
| Ruby | 1995 | Yukihiro Matsumoto | Dynamic | Multi-paradigm | .rb | 3.0 | Low |
Dense table
Row Selection
| Name | Location | Status | Balance | ||
|---|---|---|---|---|---|
| Jeremiah Marvin | abraham_harber@hotmail.com | East Lavon | Inactive | $1,063.86 | |
| Blake O'Conner | jaylen.spinka6@hotmail.com | South Crystelburgh | Inactive | $633.40 | |
| Eleanor Wyman | janis_barrows99@gmail.com | Lake Douglasbury | Inactive | $1,189.23 | |
| Adrian Marks | kayleigh_hudson@gmail.com | Cortneyshire | Inactive | $184.36 | |
| Moses Murphy | kayli.wiza@yahoo.com | Irwinfurt | Inactive | $855.93 | |
| Total | $3,926.78 | ||||
Table with row selection
Card Table
| Name | Location | Status | Balance | ||
|---|---|---|---|---|---|
| Dr. Rodolfo Okuneva V | guido_bogisich77@gmail.com | Groverberg | Active | $361.69 | |
| Erick D'Amore | shana_wolf@gmail.com | Florencioside | Inactive | $540.08 | |
| Kerry Wyman | lorenza.wiza@yahoo.com | North Vella | Inactive | $813.44 | |
| Miss Tami Bauch | claudia58@yahoo.com | Utica | Inactive | $777.48 | |
| Mindy Crist III | hassie.keeling45@yahoo.com | San Bernardino | Inactive | $542.88 | |
| Total | $3,035.57 | ||||
Table with row selection
Vertical Table
| Name | David Kim |
| d.kim@company.com | |
| Location | Seoul, KR |
| Status | Active |
| Balance | $1,000.00 |
Vertical table
Sticky Header 2
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Candace King | madonna.ratke14@hotmail.com | West Kacieland | Active | $123.61 |
| Russell Wuckert | demetrius_goyette78@hotmail.com | South San Francisco | Active | $232.86 |
| Eula Pagac | alena15@gmail.com | East Connortown | Active | $1,182.98 |
| Elvira Hegmann | nicholas_stamm@hotmail.com | Lake Gwendolyn | Inactive | $1,141.79 |
| Nancy Mann | samara64@hotmail.com | West Fayecester | Active | $395.51 |
| Malcolm Dicki I | edyth_dare89@hotmail.com | Claudiashire | Inactive | $236.59 |
| Darren Lockman | simeon91@yahoo.com | North Rebekahchester | Inactive | $512.08 |
| Lucas Paucek | francisco.hackett@yahoo.com | Denton | Inactive | $1,000.54 |
| Willie Labadie | vicenta85@hotmail.com | Lionelside | Active | $974.16 |
| Adrian Hayes | napoleon_zboncak76@gmail.com | Port Petrafort | Active | $1,166.88 |
| Seth Waters | brad_quigley3@gmail.com | Aylinside | Active | $911.53 |
| Elmer Torphy V | carlotta.ledner99@gmail.com | North Ulises | Active | $637.07 |
| Carlos Maggio | rowena_mckenzie11@gmail.com | Elizabeth | Active | $287.62 |
| Alex Graham | vida12@yahoo.com | Columbia | Active | $955.87 |
| Jorge Reynolds | pietro_bauch@gmail.com | East Maximilian | Active | $536.08 |
| Total | $10,295.17 | |||
Table with sticky header
Browser Support
| Desktop browsers | Mobile browsers | |||||||||
|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox Android | Opera Android | Safari iOS | Samsung Internet | |
| scroll-timeline | Supported 115 | Supported 115 | Not supported 111 | Supported 101 | Not supported No | Supported 115 | Not supported No | Supported 77 | Not supported No | Supported 23 |
| view-timeline | Supported 115 | Supported 115 | Not supported 114 | Supported 101 | Not supported No | Supported 115 | Not supported No | Supported 77 | Not supported No | Supported 23 |
| font-size-adjust | Supported 127 | Supported 127 | Not supported 3 | Supported 113 | Supported 16.4 | Supported 127 | Supported 4 | Supported 84 | Supported 16.4 | Not supported No |



