Design Language
- Colors
- Icons
- Buttons
- Form
- Table
- Tabs
- Tooltip
- Accordions
- Toast
- Notify
- Breadcrumbs
- Common
- Modal
- Pagination
Colors
Click on the color item to copy color path
Stanion Icons
Mobius Icons
Primary Button
Secondary Button
Tertiary Button
Add To Cart Button
Upload File Button
Upload a File
TextField
Error
TextArea
Select
DatePicker
//
//
please choose a valid date
0//
Checkbox
Radio
Dynamic Dropdown
show options
Links
Ordered List
- Item 1
- Item 1.1
- Item 1.2
- Item 1.3
- Item 2
- Item 3
- Item 4
Unordered List
- Item 1
- Item 1.1
- Item 1.2
- Item 1.3
- Item 2
- Item 3
- Item 4
Table
| Ship To | Order Total | reorder | ||||
|---|---|---|---|---|---|---|
| 1/5/2018 | 1234504 | MFG Co., 123 North Fifth, Minneapolis, MN 55406 | Submitted | 10000 | $805.92 | |
| 1/4/2018 | 1234503 | MFG Co., 123 North Fifth, Minneapolis, MN 55406 | Shipped | 10000 | $44.01 | |
| 1/3/2018 | 1234502 | MFG Co., 123 North Fifth, Minneapolis, MN 55406 | RMA | 10000 | $123.45 | |
| 1/2/2018 | 1234501 | MFG Co., 123 North Fifth, Minneapolis, MN 55406 | Complete | 10000 | $44.01 | |
| 1/1/2018 | 1234500 | MFG Co., 123 North Fifth, Minneapolis, MN 55406 | Complete | 10000 | $123.45 |
Tabs
- Selected
- Tab 2
- Tab3
Selected
Tab 2
Tab3
Tooltip
Tooltip with long text and default icon
Tooltip with custom icon
Tooltip with trigger component -
Accordions
- To obtain a price quote, add this item to your cart and select 'Request a Quote' from the cart page. You can request a quote for multiple items.
- To obtain a price quote, add this item to your cart and select 'Request a Quote' from the cart page. You can request a quote for multiple items.
- To obtain a price quote, add this item to your cart and select 'Request a Quote' from the cart page. You can request a quote for multiple items.
Toast
Notify
Due to business rules some of the products in your cart cannot be purchased. Please contact support for more information or remove the products to proceed.
Due to business rules some of the products in your cart cannot be purchased. Please contact support for more information or remove the products to proceed.
Due to business rules some of the products in your cart cannot be purchased. Please contact support for more information or remove the products to proceed.
Due to business rules some of the products in your cart cannot be purchased. Please contact support for more information or remove the products to proceed.
Short Breadcrumbs
Long Breadcrumbs
Spinner
Tags
Test Tag
Test Tag - deletable
To obtain a price quote, add this item to your cart and select 'Request a Quote' from the cart page. You can request a quote for multiple items.
Overflow menu
Modal
Pagination
| Invoice Number | Invoice Date | Terms | Due Date | Ship To / Pick Up | Status | Invoice Total | Current Balance |
|---|---|---|---|---|---|---|---|
| 0002088 | 8/14/2019 | Net 60 | Paid | Plymouth Warehouse | open | $176.00 | $0.00 |
| 0102066 | 8/14/2019 | Net 60 | Paid | Plymouth Warehouse | open | $132.00 | $0.00 |
| 0202010 | 8/14/2019 | Net 30 | 8/20/2020 | Edina Warehouse 1 | overdue | $20.00 | $10.00 |
| 0302091 | 8/14/2019 | Net 60 | Paid | Plymouth Warehouse | open | $182.00 | $0.00 |
| 0402095 | 8/14/2019 | Net 60 | Paid | Plymouth Warehouse | open | $190.00 | $0.00 |
| 0502093 | 8/14/2019 | Net 60 | Paid | Plymouth Warehouse | open | $186.00 | $0.00 |
| 0601066 | 7/20/2020 | Net 30 | Paid | Plymouth Warehouse | open | $66.00 | $0.00 |
| 0702039 | 8/14/2019 | Net 30 | Paid | Plymouth Warehouse | open | $78.00 | $0.00 |
| 0801062 | 7/20/2020 | Net 30 | Paid | Plymouth Warehouse | open | $62.00 | $0.00 |
| 0902030 | 8/14/2019 | Net 30 | Paid | Plymouth Warehouse | open | $60.00 | $0.00 |