T
Tailboard

  • Dashboards
    • Finance
    • Analytics
    • Sales
    • Sales Team
    • CRM
    • Support
  • Apps
    • Calendar
    • Kanban
    • Invoice
    • Ilustrations Bonus
  • Pages
    • Starter
    • Services
    • Faq
    • Pricing
    • Maintenance
    • Customer list
    • Admin Setting
    • 404
    • Login
    • Register
    • User Welcome
    • Select OTP
    • Input OTP
    • Forgot Password
    • Profile
    • User Setting
  • Landing page
  • Components
    • Accordion
    • Alerts
    • Avatar
    • Badge
    • Breadcrumb
    • Buttons
    • Card
    • Carousel
    • Collapse
    • Drag Drop
    • Dropdowns
    • Layouts
    • Grid
    • List Group
    • Modal
    • Navbar
    • Notification
    • Offcanvas
    • Pagination
    • Popovers
    • Pricing
    • Progress
    • Scrollbar
    • Spinners
    • Tabs
    • Tooltips
  • Forms
    • Input
    • Select
    • Check & Radio
    • Range
    • Advance Form
    • Validation
  • Tables
    • Basic Tables
    • Advance Tables
  • Typography
  • Widgets
  • Charts
  • Icons
  • Plugins
  • Documentation
T
Tailboard
  • Customizer

    Customizer

    Theme Color

    Neutral Color

    Light & Dark

    Switch RTL

    Refresh Chart Color

    How to apply? please read the documentation text
  • 3
    Messages
    Daniel Esteban
    Daniel Esteban
    What do you think about this project?
    12m ago
    Carlos Garcia
    Carlos Garcia
    Hello, how are you friends?
    30m ago
    Steven Rey
    Steven Rey
    Thank you for your help today.
    4h ago
    Roman Davis
    Roman Davis
    Do you have time? I want to call you.
    5h ago
    Show all Messages
  • 1
    Notifications
    Event will coming
    Meeting with Mr.John Navas at:10.00Am
    1h ago
    Daniel like your post: Hello World!
    3h ago
    Server maintenance
    Server maintenance at:07.00Am
    8h ago
    Carlos comment in your post: Hello World!
    1d ago
    Show all Notifications
  • avatar
    • Settings & Privacy
    • Help & Support
    • Change Language
    • Sign out

Default table

# Title Author Views
1 Intro to CSS Adam 858
2 A Long and Winding Tour of the History of UI Frameworks and Tools and the Impact on Design Adam 112
3 Intro to JavaScript Chris 1,280 
<!-- default table -->
<table class="w-full">
  <thead class="bg-stone-50 dark:bg-stone-800">
    <tr class="border-b border-stone-200 dark:border-stone-700">
      <th class="uajskeiolksb py-3 font-medium">#</th>
      <th class="uajskeiolksb py-3 font-medium">Title</th>
      <th class="uajskeiolksb py-3 font-medium">Author</th>
      <th class="uajskeiolksb py-3 font-medium">Views</th>
    </tr>
  </thead>
  <tbody>
    <tr class="border-b border-stone-200 dark:border-stone-700">
      <td class="uajskeiolksb py-3 font-medium">1</td>
      <td class="uajskeiolksb py-3 font-medium">Intro to CSS</td>
      <td class="uajskeiolksb py-3 font-medium">Adam</td>
      <td class="uajskeiolksb py-3 font-medium">858</td>
    </tr>
    <tr class="border-b border-stone-200 dark:border-stone-700">
      <td class="uajskeiolksb py-3 font-medium">2</td>
      <td class="uajskeiolksb py-3 font-medium">A Long and Winding Tour of the History of UI Frameworks and Tools and the Impact on Design</td>
      <td class="uajskeiolksb py-3 font-medium">Adam</td>
      <td class="uajskeiolksb py-3 font-medium">112</td>
    </tr>
    <tr class="border-b border-stone-200 dark:border-stone-700">
      <td class="uajskeiolksb py-3 font-medium">3</td>
      <td class="uajskeiolksb py-3 font-medium">Intro to JavaScript</td>
      <td class="uajskeiolksb py-3 font-medium">Chris</td>
      <td class="uajskeiolksb py-3 font-medium">1,280</td>
    </tr>
  </tbody>
</table>
Copy

Table Bordered

# Title Author Views
1 Intro to CSS Adam 858
2 A Long and Winding Tour of the History of UI Frameworks and Tools and the Impact on Design Adam 112
3 Intro to JavaScript Chris 1,280 
<!-- table bordered -->
<table class="w-full">
  <thead class="bg-stone-50 dark:bg-stone-800">
    <tr>
      <th class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">#</th>
      <th class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">Title</th>
      <th class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">Author</th>
      <th class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">Views</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">1</td>
      <td class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">Intro to CSS</td>
      <td class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">Adam</td>
      <td class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">858</td>
    </tr>
    <tr>
      <td class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">2</td>
      <td class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">A Long and Winding Tour of the History of UI Frameworks and Tools and the Impact on Design</td>
      <td class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">Adam</td>
      <td class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">112</td>
    </tr>
    <tr>
      <td class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">3</td>
      <td class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">Intro to JavaScript</td>
      <td class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">Chris</td>
      <td class="border border-stone-200 uajskeiolksb py-3 dark:border-stone-700 font-medium">1,280</td>
    </tr>
  </tbody>
</table>
Copy

Table Stripped & Background Hover

# Title Author Views
1 Intro to CSS Adam 858
2 A Long and Winding Tour of the History of UI Frameworks and Tools and the Impact on Design Adam 112
3 Intro to JavaScript Chris 1,280 
<!-- table stripped -->
<table class="w-full">
  <thead class="bg-stone-100 dark:bg-stone-800">
    <tr class="border-b border-stone-200 dark:border-stone-700">
      <th class="uajskeiolksb py-3 font-medium">#</th>
      <th class="uajskeiolksb py-3 font-medium">Title</th>
      <th class="uajskeiolksb py-3 font-medium">Author</th>
      <th class="uajskeiolksb py-3 font-medium">Views</th>
    </tr>
  </thead>
  <tbody>
    <tr class="border-b border-stone-200 dark:border-stone-700 bg-stone-50 dark:bg-stone-700 hover:bg-primary-50 hover:dark:bg-primary-900">
      <td class="uajskeiolksb py-3 font-medium">1</td>
      <td class="uajskeiolksb py-3 font-medium">Intro to CSS</td>
      <td class="uajskeiolksb py-3 font-medium">Adam</td>
      <td class="uajskeiolksb py-3 font-medium">858</td>
    </tr>
    <tr class="border-b border-stone-200 hover:bg-primary-50 dark:border-stone-700 hover:dark:bg-primary-900">
      <td class="uajskeiolksb py-3 font-medium">2</td>
      <td class="uajskeiolksb py-3 font-medium">A Long and Winding Tour of the History of UI Frameworks and Tools and the Impact on Design</td>
      <td class="uajskeiolksb py-3 font-medium">Adam</td>
      <td class="uajskeiolksb py-3 font-medium">112</td>
    </tr>
    <tr class="border-b border-stone-200 dark:border-stone-700 bg-stone-50 dark:bg-stone-700 hover:bg-primary-50 hover:dark:bg-primary-900">
      <td class="uajskeiolksb py-3 font-medium">3</td>
      <td class="uajskeiolksb py-3 font-medium">Intro to JavaScript</td>
      <td class="uajskeiolksb py-3 font-medium">Chris</td>
      <td class="uajskeiolksb py-3 font-medium">1,280</td>
    </tr>
  </tbody>
</table>
Copy

Table with Colors

# Title Author Views
1 Intro to CSS Adam 858
2 A Long and Winding Tour of the History of UI Frameworks and Tools and the Impact on Design Adam 112
3 Intro to JavaScript Chris 1,280
4 Intro to React Chris 1,280
5 Intro to Vue js Chris 1,280 
<!-- table colors -->
<table class="w-full">
  <thead class="bg-primary-500 text-white dark:bg-primary-900">
    <tr class="border-b border-stone-200 dark:border-stone-700">
      <th class="uajskeiolksb py-3 font-medium">#</th>
      <th class="uajskeiolksb py-3 font-medium">Title</th>
      <th class="uajskeiolksb py-3 font-medium">Author</th>
      <th class="uajskeiolksb py-3 font-medium">Views</th>
    </tr>
  </thead>
  <tbody>
    <tr class="border-b border-stone-200 dark:border-stone-700 bg-red-50 dark:bg-red-900 hover:bg-primary-50">
      <td class="uajskeiolksb py-3 font-medium">1</td>
      <td class="uajskeiolksb py-3 font-medium">Intro to CSS</td>
      <td class="uajskeiolksb py-3 font-medium">Adam</td>
      <td class="uajskeiolksb py-3 font-medium">858</td>
    </tr>
    <tr class="border-b border-stone-200 dark:border-stone-700 bg-yellow-50 dark:bg-yellow-900 hover:bg-primary-50">
      <td class="uajskeiolksb py-3 font-medium">2</td>
      <td class="uajskeiolksb py-3 font-medium">A Long and Winding Tour of the History of UI Frameworks and Tools and the Impact on Design</td>
      <td class="uajskeiolksb py-3 font-medium">Adam</td>
      <td class="uajskeiolksb py-3 font-medium">112</td>
    </tr>
    <tr class="border-b border-stone-200 dark:border-stone-700 bg-green-50 dark:bg-green-900 hover:bg-primary-50">
      <td class="uajskeiolksb py-3 font-medium">3</td>
      <td class="uajskeiolksb py-3 font-medium">Intro to JavaScript</td>
      <td class="uajskeiolksb py-3 font-medium">Chris</td>
      <td class="uajskeiolksb py-3 font-medium">1,280</td>
    </tr>
    <tr class="border-b border-stone-200 dark:border-stone-700 bg-indigo-50 dark:bg-indigo-900 hover:bg-primary-50">
      <td class="uajskeiolksb py-3 font-medium">4</td>
      <td class="uajskeiolksb py-3 font-medium">Intro to React</td>
      <td class="uajskeiolksb py-3 font-medium">Chris</td>
      <td class="uajskeiolksb py-3 font-medium">1,280</td>
    </tr>
    <tr class="border-b border-stone-200 dark:border-stone-700 bg-blue-50 dark:bg-blue-900 hover:bg-primary-50">
      <td class="uajskeiolksb py-3 font-medium">5</td>
      <td class="uajskeiolksb py-3 font-medium">Intro to Vue js</td>
      <td class="uajskeiolksb py-3 font-medium">Chris</td>
      <td class="uajskeiolksb py-3 font-medium">1,280</td>
    </tr>
  </tbody>
</table>
Copy
About Pricing Tos Contact

2025 Tailboard - All right reserved