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 | PayPal | $773.42 |
| INV002 | Pending | PayPal | $485.01 |
| INV003 | Pending | Credit Card | $637.83 |
| INV004 | Unpaid | Bank Transfer | $212.75 |
| INV005 | Pending | PayPal | $933.91 |
| INV006 | Paid | Credit Card | $355.59 |
| INV007 | Unpaid | Credit Card | $692.47 |
| Total | $4,090.98 | ||
Simple
Users
A list of all the users in your account including their name, title, email and role.
| Name | Title | Role | Actions | |
|---|---|---|---|---|
| Lenora Conroy | Internal Security Designer | lenora.conroy13@yahoo.com | Viewer | |
| Kurtis Buckridge | Human Communications Analyst | kurtis_buckridge@hotmail.com | Viewer | |
| Eriberto Ondricka | Forward Group Director | eriberto.ondricka74@yahoo.com | Viewer | |
| Kristofer Kreiger | Direct Optimization Analyst | kristofer.kreiger@gmail.com | Member | |
| Ariel Bartell | Future Interactions Executive | ariel_bartell34@gmail.com | Admin | |
| Shania Okuneva | Corporate Solutions Agent | shania.okuneva76@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 |
|---|---|---|
Oma Lakin Customer Solutions Representative oma.lakin91@hotmail.com | Admin | |
Geovanny Padberg Central Mobility Orchestrator geovanny_padberg75@gmail.com | Admin | |
Jan Leannon Regional Identity Agent jan_leannon@yahoo.com | Viewer | |
Raoul Klein International Accountability Manager raoul.klein@gmail.com | Member | |
Glenda Purdy Senior Tactics Coordinator glenda.purdy91@hotmail.com | Member | |
Zula Padberg Principal Web Strategist zula.padberg37@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 |
|---|---|---|
Aniya Weissnat Direct Identity Supervisor aniya.weissnat73@hotmail.com | Admin | |
Adrien Crona Chief Division Supervisor adrien.crona@gmail.com | Member | |
Alexane Mraz Human Implementation Facilitator alexane_mraz@hotmail.com | Member | |
Karelle Goldner Corporate Web Architect karelle.goldner18@gmail.com | Viewer | |
Major Oberbrunner Product Research Agent major.oberbrunner15@yahoo.com | Admin | |
Vito Dickens District Implementation Designer vito_dickens@gmail.com | Viewer | |
Naomi Okuneva Lead Functionality Developer naomi.okuneva21@hotmail.com | Admin | |
Bella Hane Senior Infrastructure Assistant bella_hane@hotmail.com | Member | |
Luna Jacobi Lead Security Analyst luna_jacobi38@yahoo.com | Viewer | |
Eldred Klocko International Accounts Liaison eldred_klocko61@hotmail.com | Viewer | |
Kariane Hoeger Regional Web Administrator kariane.hoeger59@gmail.com | Viewer | |
Sean Heathcote Global Functionality Executive sean.heathcote50@yahoo.com | Viewer | |
Haylee Kris Forward Research Director haylee.kris69@gmail.com | Admin | |
Bobbie McKenzie International Implementation Administrator bobbie_mckenzie@yahoo.com | Member | |
Lessie Hackett Internal Operations Manager lessie_hackett@hotmail.com | Member | |
Greyson Purdy Senior Integration Technician greyson_purdy@hotmail.com | Member | |
Maxie Lebsack Product Program Manager maxie_lebsack44@yahoo.com | Admin | |
Camila Prosacco Legacy Identity Facilitator camila_prosacco@gmail.com | Admin | |
Mathias Franey Internal Optimization Liaison mathias_franey@yahoo.com | Admin | |
Juanita Schiller Regional Usability Coordinator juanita_schiller@gmail.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 | |
|---|---|---|---|---|
| Manuel Green | kirsten_gibson66@yahoo.com | Port Brandycester | Active | $227.60 |
| Penny Beier | eleanore_walsh@yahoo.com | Kleinburgh | Inactive | $413.02 |
| Tami Kuhn-Ward | peter27@gmail.com | Hicksville | Active | $434.08 |
| Renee Mertz | denis.cormier@yahoo.com | Arvillaland | Inactive | $298.02 |
| Elsie Spencer Sr. | garland8@hotmail.com | East Jacky | Active | $505.72 |
| Total | $1,878.44 | |||
Basic table
Table with Images
| Name | Location | Status | Balance | |
|---|---|---|---|---|
Allen Nicolas @lizzie_grant | dawson42@yahoo.com | Lake Leland | Inactive | $875.49 |
Elisa Larkin @khalil66 | finn_smitham@yahoo.com | Larueview | Inactive | $1,167.61 |
Steve Legros @meggie.crist96 | lenny_kautzer18@hotmail.com | New Mollie | Inactive | $358.18 |
Caroline Kirlin @coby42 | sterling_hettinger@yahoo.com | Schuliststad | Active | $1,136.92 |
Rene Block @jeff_bartell62 | candelario12@gmail.com | East Clara | Active | $508.94 |
Table with images
Table No Horizontal Lines
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Kendra Leannon | nicole.altenwerth@yahoo.com | East Serenity | Active | $987.80 |
| Fredrick Windler | grover.olson@yahoo.com | Port Destinport | Active | $37.84 |
| Mrs. Angela Donnelly | nicolette.lang@gmail.com | North Jamel | Active | $34.00 |
| Robin Rutherford | myles24@hotmail.com | Zenaland | Active | $238.15 |
| Marsha Block | lily.jacobi31@yahoo.com | Lueilwitzcester | Inactive | $475.49 |
| Total | $1,773.28 | |||
Table without horizontal dividers
Striped Tabled
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Kerry Turner | sheridan9@gmail.com | Hartford | Inactive | $756.71 |
| Christina Thiel | sasha56@gmail.com | Quitzonville | Inactive | $780.51 |
| Amanda Hansen | axel36@yahoo.com | West Germainebury | Inactive | $882.03 |
| Andres Larkin | lester78@gmail.com | Grahamville | Inactive | $346.34 |
| Terry Schroeder | jacklyn92@hotmail.com | Fort Jalen | Inactive | $743.31 |
| Total | $3,508.90 | |||
Striped table
Vertical Lines
| Name | Location | Status | Balance | |
|---|---|---|---|---|
| Harold Herzog | fiona_grimes90@gmail.com | San Marcos | Inactive | $509.27 |
| Edward Abernathy DDS | arjun45@gmail.com | North Columbusfurt | Inactive | $921.40 |
| Duane Jacobi IV | cordell84@gmail.com | Pacochaburgh | Active | $693.44 |
| Rodolfo Jaskolski | roberta5@gmail.com | McCulloughview | Inactive | $923.28 |
| Patti Doyle | zella_zieme@gmail.com | South Patrick | Inactive | $375.84 |
| Total | $3,423.23 | |||
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 | ||
|---|---|---|---|---|---|
| Raquel Franey | fletcher_schiller@hotmail.com | West Estelstad | Active | $394.32 | |
| Dr. Chris D'Amore | bridgette.morar@yahoo.com | Bell Gardens | Active | $571.77 | |
| Eugene Zboncak | cedrick_schoen@gmail.com | Retamouth | Inactive | $1,080.89 | |
| Penny Rodriguez | anissa.oconnell@yahoo.com | West Jena | Inactive | $1,156.44 | |
| Sonja Jast | dean.fadel58@gmail.com | Fort Myriam | Inactive | $376.97 | |
| Total | $3,580.39 | ||||
Table with row selection
Card Table
| Name | Location | Status | Balance | ||
|---|---|---|---|---|---|
| Travis Johnston | francesca_krajcik55@yahoo.com | Conroe | Inactive | $522.23 | |
| Eleanor Waelchi | clementine36@gmail.com | Thelmaton | Active | $164.73 | |
| Angel Haley | richie_fay41@gmail.com | Friesenland | Active | $934.04 | |
| Donnie Smitham | fred95@hotmail.com | Fort Abigayleville | Active | $556.23 | |
| Ms. Christie O'Conner | kamren.berge-lynch@gmail.com | Schneiderboro | Active | $1,010.40 | |
| Total | $3,187.63 | ||||
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 | |
|---|---|---|---|---|
| Mr. Paul Feil | kaden85@gmail.com | North Raymondview | Inactive | $216.90 |
| Wanda Hettinger | lawson_watsica66@hotmail.com | Huntington | Inactive | $555.60 |
| Ben Kuvalis III | allison.konopelski93@yahoo.com | Jazmyneville | Inactive | $896.11 |
| Lee Jaskolski | bernita.johnson82@yahoo.com | Allen | Inactive | $272.44 |
| Ross Keeling | abe.collins@yahoo.com | Lake Dixieborough | Inactive | $125.76 |
| Preston Batz Sr. | wendell.emard@hotmail.com | New Danika | Active | $608.75 |
| Alan Cormier | roselyn37@hotmail.com | Bednarfort | Active | $563.44 |
| Dr. Carl Thiel | logan.christiansen84@gmail.com | Bridiecester | Inactive | $899.87 |
| Eugene Medhurst | deonte_wisoky@hotmail.com | New Abdiel | Inactive | $238.82 |
| Shelia Tillman | stone.hayes51@gmail.com | Enterprise | Inactive | $865.32 |
| Miss Olivia Fahey | kobe.huel@gmail.com | East Johathanboro | Inactive | $233.92 |
| Roberto Quigley | asa_johnson7@yahoo.com | Grahammouth | Inactive | $453.88 |
| Lucille Hilll | isac86@yahoo.com | Lake Selenaberg | Inactive | $1,078.88 |
| Ms. Christy Frami | vernice.moen70@yahoo.com | Maribelside | Active | $1,165.20 |
| Carol Lesch | wilton.berge@yahoo.com | San Marcos | Active | $35.26 |
| Total | $8,210.15 | |||
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 |


