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 | Credit Card | $173.60 |
| INV002 | Pending | Credit Card | $923.79 |
| INV003 | Paid | Credit Card | $527.38 |
| INV004 | Paid | Bank Transfer | $757.56 |
| INV005 | Unpaid | Credit Card | $608.08 |
| INV006 | Paid | Bank Transfer | $395.28 |
| INV007 | Pending | PayPal | $385.54 |
| Total | $3,771.23 | ||
Simple
Users
A list of all the users in your account including their name, title, email and role.
| Name | Title | Role | Actions | |
|---|---|---|---|---|
| Gwen Mann | Senior Directives Executive | gwen.mann33@hotmail.com | Admin | |
| Alf Hane | Regional Accounts Specialist | alf_hane13@gmail.com | Viewer | |
| Joshuah Thiel | Senior Creative Liaison | joshuah_thiel@gmail.com | Viewer | |
| Rodrick Runolfsson | Forward Integration Supervisor | rodrick_runolfsson@hotmail.com | Viewer | |
| Lexi Rice | Future Tactics Producer | lexi.rice@hotmail.com | Member | |
| Tania Boyle | Global Solutions Planner | tania_boyle@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 |
|---|---|---|
Guillermo Hand Human Creative Strategist guillermo.hand@yahoo.com | Viewer | |
Emil Kuhlman Lead Integration Planner emil_kuhlman@yahoo.com | Admin | |
Ladarius Emmerich Global Creative Administrator ladarius.emmerich@gmail.com | Admin | |
Dianna Balistreri Lead Solutions Orchestrator dianna.balistreri65@hotmail.com | Viewer | |
Cale Morissette Internal Accounts Planner cale.morissette51@gmail.com | Viewer | |
Lambert Bosco District Operations Planner lambert_bosco@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 |
|---|---|---|
Leanna Schinner Dynamic Data Facilitator leanna.schinner97@hotmail.com | Viewer | |
Christian Crooks Customer Integration Consultant christian.crooks@yahoo.com | Member | |
Cheyenne Wyman Human Division Producer cheyenne_wyman@yahoo.com | Member | |
Charlene Schamberger District Web Architect charlene.schamberger@hotmail.com | Viewer | |
Manuela Goodwin National Web Specialist manuela.goodwin19@gmail.com | Admin | |
Delphia Cummings Lead Implementation Analyst delphia.cummings16@gmail.com | Admin | |
Melyna Schumm Dynamic Optimization Designer melyna.schumm@hotmail.com | Member | |
Jannie Kuhn Central Directives Consultant jannie_kuhn97@hotmail.com | Member | |
Rhett Runolfsson International Interactions Analyst rhett.runolfsson@hotmail.com | Viewer | |
Josephine Hartmann Global Communications Coordinator josephine_hartmann@hotmail.com | Member | |
Alexzander Block-Goodwin Regional Communications Technician alexzander_block-goodwin39@gmail.com | Member | |
Jaquan Bartoletti Direct Implementation Supervisor jaquan.bartoletti53@gmail.com | Member | |
Andrew Howell Corporate Metrics Strategist andrew_howell@yahoo.com | Admin | |
Courtney Flatley Investor Interactions Analyst courtney.flatley@yahoo.com | Admin | |
Lenora Kilback Future Branding Architect lenora.kilback@hotmail.com | Admin | |
Rickey Gottlieb Chief Optimization Analyst rickey_gottlieb@hotmail.com | Member | |
Micaela Kuvalis Corporate Group Manager micaela_kuvalis@gmail.com | Admin | |
General Hessel Chief Program Liaison general.hessel@hotmail.com | Admin | |
Darren Stanton Customer Implementation Architect darren_stanton30@gmail.com | Admin | |
Madalyn Emard Internal Accounts Administrator madalyn.emard36@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 | |
|---|---|---|---|---|
| Victor Murphy | edmond52@gmail.com | Wildermantown | Inactive | $942.36 |
| Gilbert O'Connell | jerald_jast63@yahoo.com | Clearwater | Inactive | $1,007.77 |
| Wendell Krajcik | walton_steuber0@gmail.com | Lindhaven | Active | $171.82 |
| Herman VonRueden | donavon_lesch@gmail.com | Hintzberg | Active | $391.03 |
| Annie Johns | lindsey_mayer@yahoo.com | Lake Auroreton | Active | $51.84 |
| Total | $2,564.82 | |||
Basic table
Table with Images
| Name | Location | Status | Balance | |
|---|---|---|---|---|
Esther Denesik @fritz14 | ray10@hotmail.com | Rohnert Park | Inactive | $263.59 |
Allison Schoen @ola17 | virgie.parisian@hotmail.com | West Joseph | Inactive | $660.62 |
Marjorie Gusikowski @sandy.bosco | jerrell_trantow@yahoo.com | New Kelley | Inactive | $578.95 |
Faye Johns Jr. @levi_kuhic | kristian18@yahoo.com | Fort Khalid | Inactive | $178.23 |
Randal Beer @devonte_huels71 | kenna85@hotmail.com | Juanabury | Inactive | $1.66 |
Table with images
Table No Horizontal Lines
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Alfred Schmeler | molly.morissette@hotmail.com | West Jovanny | Inactive | $243.57 |
| Nancy Bergstrom | jarod.price@hotmail.com | Thornton | Active | $275.48 |
| Andres Romaguera | juanita_schuppe-yost@yahoo.com | South Deionworth | Inactive | $998.81 |
| Fernando Adams | rupert.okon27@yahoo.com | Fort Sasha | Inactive | $260.37 |
| Max Wyman | derrick_glover@hotmail.com | Elk Grove | Active | $383.19 |
| Total | $2,161.42 | |||
Table without horizontal dividers
Striped Tabled
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Mrs. Kate Shields | arely90@hotmail.com | North Rosettastad | Inactive | $523.83 |
| Hugo Daugherty | adriana_white80@hotmail.com | Blue Springs | Active | $616.30 |
| Mr. Scott Jacobs | obie.bernier98@gmail.com | Everettmouth | Inactive | $1,111.57 |
| Simon Dach | rebekah_conroy@yahoo.com | Kshlerintown | Inactive | $180.83 |
| Dr. Max Treutel | kasandra_hackett75@gmail.com | Augustchester | Active | $319.13 |
| Total | $2,751.66 | |||
Striped table
Vertical Lines
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Johnnie Grant V | maxine64@yahoo.com | South Trentonchester | Active | $98.11 |
| Cameron Parisian | stefanie.stamm@hotmail.com | Schummport | Active | $591.88 |
| Dr. Opal Emmerich-Runolfsson | javier_renner98@gmail.com | Matildebury | Active | $420.65 |
| Lori DuBuque | delta10@yahoo.com | Iowa City | Active | $360.43 |
| Eunice McClure | lily60@gmail.com | North Delphine | Inactive | $577.11 |
| Total | $2,048.18 | |||
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 | ||
|---|---|---|---|---|---|
| Naomi Jaskolski | sherman97@gmail.com | Traceyview | Active | $951.92 | |
| Kellie Halvorson | elvera_buckridge25@gmail.com | Port Rosalindafurt | Inactive | $331.33 | |
| Ismael Kshlerin | brenden.huel@yahoo.com | North Flavie | Inactive | $871.63 | |
| Blanche Little | andreanne83@hotmail.com | Fort Karineborough | Inactive | $276.05 | |
| Bertha Bogisich | antonia73@yahoo.com | North Ciceroville | Inactive | $438.02 | |
| Total | $2,868.95 | ||||
Table with row selection
Card Table
| Name | Location | Status | Balance | ||
|---|---|---|---|---|---|
| Santos Metz | lela13@gmail.com | East Taraberg | Active | $865.79 | |
| Freda Predovic I | marisa65@hotmail.com | Wolfton | Inactive | $63.62 | |
| Marcella McLaughlin | rhea.borer@gmail.com | West Ilene | Inactive | $982.15 | |
| Mr. Jerry Ziemann | tiffany68@gmail.com | North Jaysonchester | Inactive | $887.66 | |
| Mona Stoltenberg | megane.stiedemann-anderson@yahoo.com | Hughfield | Inactive | $539.73 | |
| Total | $3,338.95 | ||||
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 | |
|---|---|---|---|---|
| Tyler Deckow | ryley_spinka52@gmail.com | Tuckahoe | Inactive | $1,076.98 |
| Mr. Wilson Langosh MD | lola.kemmer@hotmail.com | Estebanshire | Active | $213.37 |
| Jennifer Cole | zelma79@gmail.com | Anselport | Active | $145.07 |
| Gilbert Bechtelar | lamont_langosh92@gmail.com | Grand Rapids | Active | $1,190.83 |
| Albert Stiedemann | isac.stracke31@hotmail.com | Kerlukefurt | Active | $168.33 |
| Marcella Senger | arlie41@yahoo.com | North Elvis | Active | $1,015.70 |
| Kristy Labadie-Bechtelar III | mara.parker17@yahoo.com | Fort Estel | Inactive | $218.33 |
| Natalie O'Connell | arely_mohr42@yahoo.com | Thousand Oaks | Active | $773.31 |
| Elbert Runolfsdottir | guillermo25@yahoo.com | Fort Lauretta | Inactive | $181.84 |
| Carroll Lesch | keyshawn_wunsch@gmail.com | New Albin | Inactive | $262.38 |
| Dr. Ernest Hayes | emmie.schimmel@hotmail.com | Goodyear | Active | $673.77 |
| Noah Morar | shakira.heaney@yahoo.com | Darestead | Active | $579.28 |
| Sherri Streich DVM | ova_gutkowski94@yahoo.com | Laguna Niguel | Active | $891.29 |
| Jeff Sipes | martin51@yahoo.com | Port Stephenside | Inactive | $1,190.05 |
| Jeanne Klocko I | shayne_reynolds@hotmail.com | Langworthport | Active | $42.77 |
| Total | $8,623.30 | |||
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 |


