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 | Credit Card | $395.17 |
| INV002 | Unpaid | Credit Card | $577.02 |
| INV003 | Pending | PayPal | $230.34 |
| INV004 | Paid | Bank Transfer | $875.72 |
| INV005 | Paid | PayPal | $716.23 |
| INV006 | Unpaid | Credit Card | $255.54 |
| INV007 | Paid | Credit Card | $878.34 |
| Total | $3,928.36 | ||
Simple
Users
A list of all the users in your account including their name, title, email and role.
| Name | Title | Role | Actions | |
|---|---|---|---|---|
| Santina Beier | Corporate Metrics Representative | santina_beier@yahoo.com | Admin | |
| Karen Feeney | Human Group Consultant | karen_feeney98@gmail.com | Viewer | |
| Denise Hoppe | Dynamic Infrastructure Officer | denise.hoppe98@hotmail.com | Viewer | |
| Major Fadel-Goodwin | Future Interactions Supervisor | major.fadel-goodwin@hotmail.com | Member | |
| Bethel Little | Chief Creative Analyst | bethel_little2@hotmail.com | Admin | |
| Joseph Dibbert | Internal Solutions Supervisor | joseph.dibbert@yahoo.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 |
|---|---|---|
Sonia Reichel Future Intranet Designer sonia_reichel91@yahoo.com | Viewer | |
Sam Keeling Customer Security Assistant sam_keeling@hotmail.com | Member | |
Craig Rempel Direct Quality Strategist craig_rempel@gmail.com | Viewer | |
Minnie Osinski International Integration Director minnie_osinski7@yahoo.com | Member | |
Ambrose Rice Principal Infrastructure Technician ambrose.rice23@gmail.com | Viewer | |
Heather Simonis Senior Marketing Analyst heather.simonis@hotmail.com | Member |
Sticky header
Users
A list of all the users in your account including their name, title, email and role.
| Name | Role | Actions |
|---|---|---|
Grayson MacGyver Future Optimization Administrator grayson_macgyver33@hotmail.com | Member | |
Gia Spinka Forward Group Facilitator gia.spinka@gmail.com | Member | |
Elenora Erdman Forward Security Consultant elenora.erdman@yahoo.com | Viewer | |
Earnestine Purdy Central Integration Administrator earnestine_purdy99@yahoo.com | Admin | |
Luke O'Conner Central Assurance Liaison luke.oconner@gmail.com | Admin | |
Brooke Cruickshank Future Intranet Architect brooke.cruickshank73@hotmail.com | Viewer | |
Sylvester Murray Senior Mobility Planner sylvester_murray57@gmail.com | Admin | |
Grayson Pfannerstill Central Web Strategist grayson_pfannerstill@hotmail.com | Member | |
Ignacio Pagac Global Program Supervisor ignacio.pagac@hotmail.com | Viewer | |
Ollie Renner International Tactics Planner ollie_renner75@hotmail.com | Member | |
Tiffany Anderson-Cartwright Central Data Officer tiffany.anderson-cartwright@hotmail.com | Admin | |
Lorena Bahringer Future Operations Developer lorena_bahringer2@yahoo.com | Member | |
Verna Mertz Dynamic Accounts Manager verna.mertz@gmail.com | Member | |
Carole Towne Legacy Response Architect carole.towne38@yahoo.com | Viewer | |
Jordon Barton Customer Quality Facilitator jordon.barton78@hotmail.com | Admin | |
Phyllis Emmerich Future Markets Administrator phyllis_emmerich@yahoo.com | Viewer | |
Susan Turner Chief Web Planner susan.turner@yahoo.com | Admin | |
Fannie Senger Corporate Creative Planner fannie.senger@hotmail.com | Member | |
Geovanny Blanda Legacy Interactions Officer geovanny.blanda51@gmail.com | Member | |
Geneva Metz Customer Markets Producer geneva.metz6@hotmail.com | Viewer |
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 | |
|---|---|---|---|---|
| Irene Stehr | joshua49@yahoo.com | North Billiechester | Inactive | $396.38 |
| Robb White-Welch | ramon.reynolds@hotmail.com | West Gennaroborough | Inactive | $587.45 |
| Danny Friesen | lucious39@yahoo.com | Pearland | Active | $1,054.03 |
| Thelma Pacocha | becky70@hotmail.com | New Julieborough | Inactive | $1,040.64 |
| Mya Haley | davonte.terry93@gmail.com | West Abigale | Inactive | $1,036.26 |
| Total | $4,114.76 | |||
Basic table
Table with Images
| Name | Location | Status | Balance | |
|---|---|---|---|---|
Tillman Ledner @enrique_huels | hermina.kuhn@yahoo.com | North Aliabury | Inactive | $319.82 |
Sheila Jast @nick.hansen | louise7@gmail.com | Oak Lawn | Inactive | $806.09 |
Muriel Fay @tracy_auer | tina_mills62@yahoo.com | North Hesterstead | Active | $228.40 |
Patrick Hansen @joel67 | jerome_keebler67@yahoo.com | East Vincenzaburgh | Inactive | $653.99 |
Kacie Sporer @sonja43 | clint.rath41@hotmail.com | Boscoworth | Active | $926.20 |
Table with images
Table No Horizontal Lines
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Mr. Eloise Mertz | homer59@yahoo.com | Daughertyworth | Inactive | $223.44 |
| Clotilde Hahn V | lonnie71@yahoo.com | Royport | Active | $659.42 |
| Marguerite Wiza | elaine.nader64@hotmail.com | Karenfurt | Active | $752.44 |
| Miss Geovanny Effertz | sherman.hand@yahoo.com | North Lacey | Inactive | $964.25 |
| Magnolia Schumm | tamara79@hotmail.com | Fadelview | Inactive | $318.29 |
| Total | $2,917.84 | |||
Table without horizontal dividers
Striped Tabled
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Yazmin Berge | jeffrey_king0@yahoo.com | Silver Spring | Active | $1,173.56 |
| Lesley Maggio | maggie.dickens@gmail.com | Morissetteshire | Inactive | $834.71 |
| Damon Towne | lewis.mohr@gmail.com | New Audra | Inactive | $1,044.78 |
| Angelica Stracke V | floyd.christiansen77@gmail.com | Nolanhaven | Active | $612.04 |
| Roslyn Gibson IV | ramon71@hotmail.com | Lake Marciastad | Active | $130.63 |
| Total | $3,795.72 | |||
Striped table
Vertical Lines
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Mrs. Tad Mitchell | cristobal_ferry@gmail.com | East Laurynside | Active | $60.85 |
| Nathan Mann | trevor44@hotmail.com | West Jordyn | Inactive | $405.90 |
| Kristie Bergstrom | gonzalo20@yahoo.com | Scotfield | Active | $808.54 |
| Jacquelyn VonRueden | hershel_bartoletti@hotmail.com | Ritchiebury | Active | $144.56 |
| Doug Konopelski | branson81@hotmail.com | Jettietown | Inactive | $1,072.41 |
| Total | $2,492.26 | |||
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 | ||
|---|---|---|---|---|---|
| Quentin Halvorson | lura_oberbrunner@gmail.com | Fort Coycester | Active | $535.95 | |
| Merl Larson | shana53@gmail.com | Napa | Inactive | $351.40 | |
| Merle Hodkiewicz | andre_graham@gmail.com | Tillmantown | Active | $975.69 | |
| Asia Runte | laila42@yahoo.com | Lynchfurt | Active | $1,056.32 | |
| Sidney Schumm | kelli_predovic@hotmail.com | Fort Mark | Inactive | $1,036.20 | |
| Total | $3,955.56 | ||||
Table with row selection
Card Table
| Name | Location | Status | Balance | ||
|---|---|---|---|---|---|
| Tommy Blick | lindsay.glover68@yahoo.com | Lake Edmond | Inactive | $161.60 | |
| Lucas Lebsack | mathew.hamill@hotmail.com | Wunschville | Inactive | $381.00 | |
| Abdiel Robel DVM | helene58@hotmail.com | Lake Tracey | Inactive | $824.17 | |
| Debbie Abernathy | ana65@yahoo.com | East Coleman | Active | $275.94 | |
| Flossie Lockman | annamarie58@gmail.com | North Emma | Active | $389.46 | |
| Total | $2,032.17 | ||||
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 | |
|---|---|---|---|---|
| Ricky Grimes | heather82@gmail.com | Jeanieberg | Inactive | $1,087.86 |
| Khalid Schaden | ida_koss@yahoo.com | DeKalb | Active | $1,143.59 |
| Khalil Schuster | roger_heathcote@yahoo.com | Birmingham | Active | $1,140.85 |
| Ocie Grimes | grant.kihn-hermann43@gmail.com | Hempstead | Inactive | $158.17 |
| Dr. Mae Walsh I | kelly37@hotmail.com | West Audra | Active | $512.16 |
| Hector O'Conner | genoveva73@yahoo.com | Kirlinberg | Active | $73.07 |
| Gordon Steuber | clint_witting@yahoo.com | Alexandroville | Inactive | $502.68 |
| Mr. Anthony Crooks | shawn_jerde@hotmail.com | Romaguerashire | Active | $342.20 |
| Hubert Monahan | henrietta_oberbrunner@yahoo.com | Escondido | Active | $423.40 |
| Cody Satterfield | jody96@yahoo.com | Stokesstad | Inactive | $472.07 |
| Karl Legros | dave.brown@yahoo.com | Alfredtown | Active | $1,045.85 |
| Alison Osinski | sylvester.swift@gmail.com | Gusfort | Active | $443.01 |
| Abelardo Bernier | jovanny22@gmail.com | Larkinbury | Inactive | $151.60 |
| Pearl Terry | unique_roberts@yahoo.com | Burdetteview | Active | $231.16 |
| Preston Mills | francisco.hammes32@gmail.com | Colton | Active | $812.90 |
| Total | $8,540.57 | |||
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 |

