Laravel Table Component

Free · MIT

A styled, composable table component for displaying tabular data with striped, hoverable, bordered, and compact variants.

A Table built for the TALL stack — Blade, Livewire 3 & 4, Alpine.js and Tailwind CSS 4. Server-rendered by default, dark-mode ready, and WCAG-minded. Drop it in with a single Blade tag: <x-aura::table>

Try it live in the docs Install free

Installation

composer require bluestarsystem/aura-ui

Usage

<x-aura::table>
    <x-aura::table.head>
        <x-aura::table.row>
            <x-aura::table.header>Name</x-aura::table.header>
            <x-aura::table.header>Email</x-aura::table.header>
            <x-aura::table.header align="right">Role</x-aura::table.header>
        </x-aura::table.row>
    </x-aura::table.head>
    <x-aura::table.body>
        <x-aura::table.row>
            <x-aura::table.cell>Alice Johnson</x-aura::table.cell>
            <x-aura::table.cell>[email protected]</x-aura::table.cell>
            <x-aura::table.cell align="right">Admin</x-aura::table.cell>
        </x-aura::table.row>
    </x-aura::table.body>
</x-aura::table>

See the full API, props and live examples in the Table documentation.

Overview

The <x-aura::table> component provides a simple, styled HTML table with sub-components for full composability. It is not a DataTable — it renders static markup without sorting, filtering, or pagination. Use it for settings pages, pricing comparisons, simple data displays, and any context where a clean table is needed.

Sub-components: table.head, table.body, table.row, table.header, table.cell.

Props

Table

Prop	Type	Default	Description
`striped`	`bool`	`false`	Alternating row background colors
`hoverable`	`bool`	`false`	Highlight rows on hover
`bordered`	`bool`	`false`	Add borders to all cells
`compact`	`bool`	`false`	Reduce cell padding for dense data