Basic Table
A collection basic to advanced table design that you can use to your data.
Basic Table
Using the most basic table markup.
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
3 |
Ashton Cox |
Junior Technical Author |
$86,000 |
4 |
Cedric Kelly |
Senior Javascript Developer |
$433,060 |
5 |
Airi Satou |
Accountant |
$162,700 |
Source Code
<table class="table">
<thead>..</thead>
<tbody>...</tbody>
</table>
Striped Rows
Add zebra-striping to any table row.
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
3 |
Ashton Cox |
Junior Technical Author |
$86,000 |
4 |
Cedric Kelly |
Senior Javascript Developer |
$433,060 |
5 |
Airi Satou |
Accountant |
$162,700 |
Source Code
<table class="table table-striped">
<thead>..</thead>
<tbody>...</tbody>
</table>
Bordered Table
Add borders on all sides of the table and cells.
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
3 |
Ashton Cox |
Junior Technical Author |
$86,000 |
4 |
Cedric Kelly |
Senior Javascript Developer |
$433,060 |
5 |
Airi Satou |
Accountant |
$162,700 |
Source Code
<table class="table table-bordered">
<thead>..</thead>
<tbody>...</tbody>
</table>
Hoverable Rows
To enable a hover state on table rows.
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
3 |
Ashton Cox |
Junior Technical Author |
$86,000 |
4 |
Cedric Kelly |
Senior Javascript Developer |
$433,060 |
5 |
Airi Satou |
Accountant |
$162,700 |
Source Code
<table class="table table-hover">
<thead>..</thead>
<tbody>...</tbody>
</table>
12 Color Variations for Table Header
A custom color for the head of the tables.
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
Source Code
<table class="table table-bordered">
<thead class="thead-colored thead-info">..</thead>
<tbody>...</tbody>
</table>
Class Reference
Class |
Value |
class="thead-colored thead-[value]" |
primary | success | warning | danger | info | teal | indigo | purple | pink | orange |
12 Full Color Variations for Table
A custom full color variations for the entire table.
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
3 |
Ashton Cox |
Junior Technical Author |
$86,000 |
4 |
Cedric Kelly |
Senior Javascript Developer |
$433,060 |
5 |
Airi Satou |
Accountant |
$162,700 |
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
3 |
Ashton Cox |
Junior Technical Author |
$86,000 |
4 |
Cedric Kelly |
Senior Javascript Developer |
$433,060 |
5 |
Airi Satou |
Accountant |
$162,700 |
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
3 |
Ashton Cox |
Junior Technical Author |
$86,000 |
4 |
Cedric Kelly |
Senior Javascript Developer |
$433,060 |
5 |
Airi Satou |
Accountant |
$162,700 |
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
ID |
Name |
Position |
Salary |
1 |
Tiger Nixon |
System Architect |
$320,800 |
2 |
Garrett Winters |
Accountant |
$170,750 |
Source Code
<table class="table table-bordered table-primary">
<thead>..</thead>
<tbody>...</tbody>
</table>
Class Reference
Class |
Value |
class="table table-[value]" |
primary | success | warning | danger | info | teal | indigo | purple | pink | orange |