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 | Paid | Bank Transfer | $209.52 |
| INV002 | Paid | PayPal | $881.09 |
| INV003 | Paid | Bank Transfer | $923.98 |
| INV004 | Pending | Bank Transfer | $954.46 |
| INV005 | Paid | Credit Card | $948.61 |
| INV006 | Unpaid | PayPal | $244.80 |
| INV007 | Paid | Credit Card | $875.29 |
| Total | $5,037.75 | ||
Simple
Users
A list of all the users in your account including their name, title, email and role.
| Name | Title | Role | Actions | |
|---|---|---|---|---|
| Ruben Okuneva | National Creative Engineer | ruben_okuneva97@hotmail.com | Admin | |
| Roxanne Sanford | Senior Intranet Liaison | roxanne_sanford85@yahoo.com | Member | |
| John Mraz | National Intranet Representative | john_mraz91@gmail.com | Member | |
| Loyce Bernier | Lead Security Analyst | loyce.bernier@gmail.com | Viewer | |
| Daron Kuphal | Regional Research Officer | daron.kuphal4@yahoo.com | Member | |
| Ricky Corkery | National Program Producer | ricky_corkery@hotmail.com | Member |
Stacked on mobile
Users
A list of all the users in your account including their name, title, email and role.
| Name | Role | Actions |
|---|---|---|
Jarrod Reinger Corporate Accounts Orchestrator jarrod.reinger@gmail.com | Viewer | |
Juliet O'Reilly Corporate Tactics Assistant juliet_oreilly3@hotmail.com | Viewer | |
Craig Zieme Dynamic Factors Designer craig_zieme21@yahoo.com | Admin | |
Leatha Erdman Principal Creative Executive leatha.erdman@gmail.com | Admin | |
Bernie Stamm International Research Agent bernie.stamm@yahoo.com | Member | |
Mohammed Mills Human Tactics Analyst mohammed.mills31@gmail.com | Admin |
Sticky header
Users
A list of all the users in your account including their name, title, email and role.
| Name | Role | Actions |
|---|---|---|
Javon Lueilwitz Lead Functionality Specialist javon.lueilwitz@gmail.com | Member | |
Lavonne Becker Product Research Engineer lavonne.becker@hotmail.com | Member | |
Alverta Kemmer Internal Identity Planner alverta_kemmer@hotmail.com | Viewer | |
Mallie Tillman Investor Applications Representative mallie_tillman@hotmail.com | Viewer | |
Brenda Hessel Direct Usability Producer brenda_hessel@yahoo.com | Admin | |
Bernie Gottlieb Customer Communications Designer bernie_gottlieb@gmail.com | Viewer | |
Deontae Kovacek District Factors Technician deontae_kovacek13@hotmail.com | Viewer | |
Evalyn Schinner Senior Accounts Architect evalyn.schinner@gmail.com | Viewer | |
Hallie Carter Global Solutions Coordinator hallie_carter6@hotmail.com | Viewer | |
Agustin Murazik-Shields District Marketing Technician agustin_murazik-shields83@hotmail.com | Member | |
Viola Mosciski Internal Response Technician viola_mosciski94@hotmail.com | Viewer | |
Aidan Lynch District Accountability Engineer aidan_lynch@yahoo.com | Member | |
Alek Welch Direct Markets Assistant alek.welch17@yahoo.com | Admin | |
Broderick Jones Regional Factors Engineer broderick_jones50@hotmail.com | Admin | |
Amie Grimes Forward Identity Assistant amie.grimes72@gmail.com | Member | |
Aisha Funk Chief Metrics Executive aisha.funk66@hotmail.com | Member | |
Delphine Haag Customer Response Administrator delphine_haag57@gmail.com | Member | |
Eriberto Crooks Investor Configuration Administrator eriberto.crooks@hotmail.com | Member | |
Maybell Rath Lead Usability Architect maybell.rath49@hotmail.com | Member | |
Keyshawn Fadel Central Response Producer keyshawn_fadel@hotmail.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 | |
|---|---|---|---|---|
| Rachel Cremin | darrick.simonis23@hotmail.com | Predovicfield | Active | $720.26 |
| Joel Wisozk | mollie_huels90@yahoo.com | Jeradchester | Active | $576.57 |
| Ms. April Baumbach | triston.bartell19@hotmail.com | Tinley Park | Inactive | $798.28 |
| Angel Herman | noel90@hotmail.com | West Harley | Inactive | $875.25 |
| Noah Bauch | cyrus91@hotmail.com | Lake Zelmatown | Active | $847.71 |
| Total | $3,818.07 | |||
Basic table
Table with Images
| Name | Location | Status | Balance | |
|---|---|---|---|---|
Bridget Rau @felicity_kilback | ansley29@hotmail.com | Sherwoodworth | Inactive | $1,120.30 |
Nathan Nicolas @marianne_willms75 | leilani.kilback91@yahoo.com | Leonardborough | Inactive | $756.14 |
Elsie Grant @april48 | donnie.beatty86@gmail.com | Malden | Active | $910.92 |
Stewart Ledner @loren.davis45 | adrien_nitzsche@gmail.com | Ignatiusmouth | Active | $1,053.80 |
Gerardo Herman @gilberto.bradtke | narciso45@hotmail.com | Paramount | Active | $63.94 |
Table with images
Table No Horizontal Lines
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Austin Senger | aron48@gmail.com | Roanoke | Active | $1,114.37 |
| Lisa Howe | makenzie_stehr-damore@yahoo.com | Mount Prospect | Inactive | $109.77 |
| Darnell Murphy-Collier | dejuan19@gmail.com | Travisburgh | Inactive | $120.69 |
| Sergio Erdman | ian_shanahan51@gmail.com | Damienmouth | Active | $231.36 |
| Shannon Will | salvatore_mckenzie16@hotmail.com | East Cooper | Active | $440.78 |
| Total | $2,016.97 | |||
Table without horizontal dividers
Striped Tabled
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Gloria Kling | bailee9@yahoo.com | Zemlaktown | Active | $859.91 |
| Desiree Wintheiser | kieran.stroman37@yahoo.com | Lednerfield | Inactive | $1,167.14 |
| Manuel Zemlak | mona.hamill-koss@yahoo.com | West Oliver | Inactive | $1,166.90 |
| Morris Hoppe | camille94@yahoo.com | North Cordell | Active | $1,142.10 |
| Lula Rippin | sigmund.romaguera25@gmail.com | Lake Roxanneberg | Inactive | $83.19 |
| Total | $4,419.24 | |||
Striped table
Vertical Lines
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Drew Beier | miller88@hotmail.com | Lake Brendachester | Active | $1,109.97 |
| Betsy Reichel | lacey.robel@gmail.com | Burnsville | Active | $535.75 |
| Gordon Leannon-Hodkiewicz | erwin_hegmann@yahoo.com | Allanberg | Inactive | $859.81 |
| Carole Runolfsdottir | ollie_von@gmail.com | East Braxton | Active | $295.36 |
| Andrea Langworth | ethyl.mohr@gmail.com | Vonburgh | Active | $972.05 |
| Total | $3,772.94 | |||
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 | ||
|---|---|---|---|---|---|
| Cornelius Harris | danielle.ullrich86@gmail.com | St. Joseph | Active | $642.72 | |
| Joy Willms | brown.effertz78@hotmail.com | New Orleans | Inactive | $792.19 | |
| Blanca Borer | julius.kessler@yahoo.com | Draper | Active | $9.40 | |
| Darrel Stanton | dortha_koepp@gmail.com | Danykashire | Inactive | $842.41 | |
| Carrie Farrell | eldora_homenick@yahoo.com | Lake Ayden | Inactive | $454.43 | |
| Total | $2,741.15 | ||||
Table with row selection
Card Table
| Name | Location | Status | Balance | ||
|---|---|---|---|---|---|
| Danny Bashirian | dominic52@hotmail.com | Lake Norrisview | Active | $473.46 | |
| Sheryl Torphy | robb55@hotmail.com | Fort Montanaboro | Active | $1,075.55 | |
| John Nitzsche PhD | wilton.franecki@hotmail.com | North Alanatown | Active | $828.51 | |
| Loren Zemlak | abbey.hudson@hotmail.com | Lake Amiraburgh | Inactive | $32.51 | |
| Rudolph Olson | berenice8@yahoo.com | Pinkshire | Active | $464.89 | |
| Total | $2,874.92 | ||||
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 | |
|---|---|---|---|---|
| Jeanette Barrows | cecilia81@gmail.com | Dayton | Active | $234.42 |
| Omar Schroeder | laurence54@hotmail.com | Port Chelseachester | Active | $1,057.76 |
| Virgil Orn | kurtis_cormier@hotmail.com | Aurora | Active | $186.51 |
| Roy Rempel | lincoln.hermann42@gmail.com | New Kenneditown | Inactive | $1,186.65 |
| Anita Schaden | willis_haley84@yahoo.com | Fort Maximus | Active | $266.20 |
| Cory Wilderman | dallas_donnelly57@gmail.com | Clydehaven | Inactive | $188.59 |
| Barbara Blick | carlie_bogisich@yahoo.com | Port Markusstead | Inactive | $304.14 |
| Miss Raquel Hackett | jett18@gmail.com | North Damarisport | Active | $174.50 |
| Ms. Krista Dooley | osvaldo.gibson@gmail.com | West Dessie | Active | $265.13 |
| Ann Mills MD | nicholaus80@hotmail.com | New Athena | Active | $842.16 |
| Kathryn Gleichner | courtney53@gmail.com | Jordyville | Active | $315.03 |
| Mr. Lorenzo Schumm I | jannie51@hotmail.com | Kuvalisfield | Inactive | $676.31 |
| Bobby Fahey | april_sauer43@yahoo.com | Vineland | Active | $202.33 |
| Patty Corwin | anita.conn35@yahoo.com | North Shanon | Active | $1,115.04 |
| Corey Erdman | rosa23@hotmail.com | Schadenside | Active | $397.81 |
| Total | $7,412.58 | |||
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 |
