Fast Delivery! Order in-stock items before 7 p.m. CST Monday thru Thursday - get the next day!
loading content
Design System
Colors
Icons
Typography
Buttons
Form
Table
Tabs
Tooltip
Accordions
Toast
Notify
Breadcrumbs
Common
Modal
Pagination
Colors
Click on the color item to copy color path
Werner Icons
Mobius Icons
Tooltip
This is Headline 1
This is Headline 2
This is Headline 3
This is Headline 4
This is Headline 5
This is Headline 6
This is Paragraph
Primary Button
Secondary Button
Tertiary 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 iconMore Info
Tooltip with custom iconMore Info
Tooltip with trigger component - Click hereMore Info
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
Success Notification:Additional Copy Goes Here
Danger Notification:Additional Copy Goes Here
Info Notification:Additional Copy Goes Here
Warning Notification:Additional Copy Goes Here
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
Per Page: 10
More Info| Invoice Number | Invoice Date | Terms | Due Date | Ship To / Pick Up | Status | Invoice Total | Current Balance |
|---|---|---|---|---|---|---|---|
| 0002087 | 8/14/2019 | Net 60 | Paid | Plymouth Warehouse | open | $174.00 | $0.00 |
| 010201 | 8/14/2019 | Net 30 | 8/20/2020 | Edina Warehouse 1 | overdue | $2.00 | $1.00 |
| 0202043 | 8/14/2019 | Net 30 | Paid | Plymouth Warehouse | open | $86.00 | $0.00 |
| 0301045 | 7/20/2020 | Net 30 | 8/20/2020 | Edina Warehouse 1 | open | $45.00 | $45.00 |
| 0402095 | 8/14/2019 | Net 60 | Paid | Plymouth Warehouse | open | $190.00 | $0.00 |
| 0502010 | 8/14/2019 | Net 30 | 8/20/2020 | Edina Warehouse 1 | overdue | $20.00 | $10.00 |
| 0602029 | 8/14/2019 | Net 30 | Paid | Edina Warehouse 1 | open | $58.00 | $0.00 |
| 0702080 | 8/14/2019 | Net 60 | Paid | Plymouth Warehouse | open | $160.00 | $0.00 |
| 0802082 | 8/14/2019 | Net 60 | Paid | Plymouth Warehouse | open | $164.00 | $0.00 |
| 0901082 | 7/20/2020 | Net 30 | Paid | Plymouth Warehouse | open | $82.00 | $0.00 |
Per Page: 10
More InfoBasic/Row Column Sizing:
Â
2 Column - [12,6,6,8,8]+[12,6,6,4,4] --- Subject to change depending on how you have split.
Â
- Change the last two numbers (bold) for what size you want on desktop/large screen, Mobile/Tablet should already be formatted.
- Ex. If you want 5 + 7 it will look like this [12,6,6,5,5]+[12,6,6,7,7]
Â
3 Column - [12,6,6,4,4]+[12,6,6,4,4]+[12,6,6,4,4]
Â
4 Column - [12,6,6,3,3]+[12,6,6,3,3]+[12,6,6,3,3]+[12,6,6,3,3]
Â
5 Column - [12,6,6,2.4,2.4]+[12,6,6,2.4,2.4]+[12,6,6,2.4,2.4]+[12,6,6,2.4,2.4]+[12,6,6,2.4,2.4]
Â
6 Column - [12,4,4,2,2]+[12,4,4,2,2]+[12,4,4,2,2]+[12,4,4,2,2]+[12,4,4,2,2]+[12,4,4,2,2]
Â
Note* These all may require some tweaking depending on if you're using buttons or content blocks.Â