Contextual classes

Add the .table-{color} class to the <tr> element for coloured table rows.

Name Country Company
Lucas smith Australia Apple, Inc.
Janet Abshire USA Pinterest
Lucas Koch England Reddit
Gladys Schuster USA Coursera
George Clinton Canada Facebook
Jennifer Weber New Zealand Lyft

Table head colors

Use the .table class for default table styling.

Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04
Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04
Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04
Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04
Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04
Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04
Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04
Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04

Table hover using primary color

Use the .table-hover with the .table-hover-primary class to add hover functionality using the primary color

Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04

Table hover using secondary color

Use the .table-hover with the .table-hover-secondary class to add hover functionality using the secondary color

Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04

Table hover using info color

Use the .table-hover with the .table-hover-info class to add hover functionality using the info color

Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04

Table hover using success color

Use the .table-hover with the .table-hover-success class to add hover functionality using the success color

Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04

Table hover using warning color

Use the .table-hover with the .table-hover-warning class to add hover functionality using the warning color

Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04

Table hover using danger color

Use the .table-hover with the .table-hover-danger class to add hover functionality using the danger color

Name Ticker Price
Apple Inc. AAPL 115.52
Google Inc. GOOG 635.30
Microsoft Corporation MSFT 46.74
LinkedIn Corp LNKD 190.04