Skip to main content
Version: 3.0

Icon column

Overview

Icon columns render an icon representing their contents:

use Filament\Tables\Columns\IconColumn;

IconColumn::make('status')
->icon(fn (string $state): string => match ($state) {
'draft' => 'heroicon-o-pencil',
'reviewing' => 'heroicon-o-clock',
'published' => 'heroicon-o-check-circle',
})

In the function, $state is the value of the column, and $record can be used to access the underlying Eloquent record.

Icon column

Customizing the color

Icon columns may also have a set of icon colors, using the same syntax. They may be either danger, gray, info, primary, success or warning:

use Filament\Tables\Columns\IconColumn;

IconColumn::make('status')
->color(fn (string $state): string => match ($state) {
'draft' => 'info',
'reviewing' => 'warning',
'published' => 'success',
default => 'gray',
})

In the function, $state is the value of the column, and $record can be used to access the underlying Eloquent record.

Icon column with color

Customizing the size

The default icon size is IconColumnSize::Large, but you may customize the size to be either IconColumnSize::ExtraSmall, IconColumnSize::Small, IconColumnSize::Medium or IconColumnSize::ExtraLarge:

use Filament\Tables\Columns\IconColumn;

IconColumn::make('status')
->size(IconColumn\IconColumnSize::Medium)
Medium-sized icon column

Handling booleans

Icon columns can display a check or cross icon based on the contents of the database column, either true or false, using the boolean() method:

use Filament\Tables\Columns\IconColumn;

IconColumn::make('is_featured')
->boolean()
Icon column to display a boolean

Customizing the boolean icons

You may customize the icon representing each state. Icons are the name of a Blade component present. By default, Heroicons are installed:

use Filament\Tables\Columns\IconColumn;

IconColumn::make('is_featured')
->boolean()
->trueIcon('heroicon-o-check-badge')
->falseIcon('heroicon-o-x-mark')
Icon column to display a boolean with custom icons

Customizing the boolean colors

You may customize the icon color representing each state. These may be either danger, gray, info, primary, success or warning:

use Filament\Tables\Columns\IconColumn;

IconColumn::make('is_featured')
->boolean()
->trueColor('info')
->falseColor('warning')
Icon column to display a boolean with custom colors