Icon Entry

Introduction

Icon entries render icons that represent the state of your data. They are particularly useful for displaying status indicators, boolean values, or any state that can be visualized with icons.

use Filament\Infolists\Components\IconEntry;
use Filament\Support\Icons\Heroicon;

IconEntry::make('status')
    ->icon(fn (string $state): string => match ($state) {
        'draft' => Heroicon::OutlinedPencil,
        'published' => Heroicon::OutlinedCheckCircle,
    })

Available Methods

Icon Configuration

string|Htmlable|Closure

Set the icon to display based on the entry’s state.

use Filament\Support\Icons\Heroicon;

IconEntry::make('status')
    ->icon(fn (string $state): string => match ($state) {
        'draft' => Heroicon::OutlinedPencil,
        'reviewing' => Heroicon::OutlinedClock,
        'published' => Heroicon::OutlinedCheckCircle,
    })

string|array|Closure

Set the color of the icon.

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

IconSize|string|Closure

Set the size of the icon.

use Filament\Support\Enums\IconSize;

IconEntry::make('status')
    ->size(IconSize::Medium)

Boolean Mode

bool|Closure

Enable boolean mode to display check/cross icons for true/false values.

IconEntry::make('is_active')
    ->boolean()

string|Htmlable|Closure

Set the icon for true values in boolean mode.

use Filament\Support\Icons\Heroicon;

IconEntry::make('is_featured')
    ->boolean()
    ->trueIcon(Heroicon::OutlinedStar)

string|Htmlable|Closure

Set the icon for false values in boolean mode.

use Filament\Support\Icons\Heroicon;

IconEntry::make('is_featured')
    ->boolean()
    ->falseIcon(Heroicon::OutlinedXMark)

string|array|Closure

Set the color for true values in boolean mode.

IconEntry::make('is_active')
    ->boolean()
    ->trueColor('success')

string|array|Closure

Set the color for false values in boolean mode.

IconEntry::make('is_active')
    ->boolean()
    ->falseColor('danger')

string|Htmlable|Closure

Set both icon and color for true values.

use Filament\Support\Icons\Heroicon;

IconEntry::make('is_active')
    ->boolean()
    ->true(Heroicon::OutlinedCheckCircle, 'success')

string|Htmlable|Closure

Set both icon and color for false values.

use Filament\Support\Icons\Heroicon;

IconEntry::make('is_active')
    ->boolean()
    ->false(Heroicon::OutlinedXCircle, 'danger')

Multiple Icons

bool|Closure

Display multiple icons with line breaks when the state is an array.

IconEntry::make('features')
    ->icon(Heroicon::OutlinedCheckCircle)
    ->listWithLineBreaks()

Examples

Status Indicator

use Filament\Support\Icons\Heroicon;

IconEntry::make('status')
    ->icon(fn (string $state): string => match ($state) {
        'draft' => Heroicon::OutlinedPencil,
        'reviewing' => Heroicon::OutlinedClock,
        'published' => Heroicon::OutlinedCheckCircle,
        'rejected' => Heroicon::OutlinedXCircle,
    })
    ->color(fn (string $state): string => match ($state) {
        'draft' => 'gray',
        'reviewing' => 'warning',
        'published' => 'success',
        'rejected' => 'danger',
    })

Boolean Flag

IconEntry::make('is_active')
    ->boolean()
    ->trueColor('success')
    ->falseColor('danger')
    ->label('Active Status')

Feature Badges

use Filament\Support\Icons\Heroicon;

IconEntry::make('is_featured')
    ->boolean()
    ->true(Heroicon::OutlinedStar, 'warning')
    ->false(false) // Hide icon when false

Verification Status

use Filament\Support\Icons\Heroicon;

IconEntry::make('email_verified_at')
    ->boolean()
    ->trueIcon(Heroicon::OutlinedCheckBadge)
    ->trueColor('success')
    ->falseIcon(Heroicon::OutlinedExclamationCircle)
    ->falseColor('warning')
    ->label('Email Verified')

Priority Levels

use Filament\Support\Icons\Heroicon;
use Filament\Support\Enums\IconSize;

IconEntry::make('priority')
    ->icon(fn (string $state): string => match ($state) {
        'low' => Heroicon::OutlinedArrowDown,
        'medium' => Heroicon::OutlinedMinus,
        'high' => Heroicon::OutlinedArrowUp,
        'urgent' => Heroicon::OutlinedExclamationTriangle,
    })
    ->color(fn (string $state): string => match ($state) {
        'low' => 'gray',
        'medium' => 'primary',
        'high' => 'warning',
        'urgent' => 'danger',
    })
    ->size(IconSize::Large)

Form Components

Table Components

Layout Components

Infolist Components

Introduction

Available Methods

Icon Configuration

Boolean Mode

Multiple Icons

Examples

Status Indicator

Boolean Flag

Feature Badges

Verification Status

Priority Levels

​Introduction

​Available Methods

​Icon Configuration

​Boolean Mode

​Multiple Icons

​Examples

​Status Indicator

​Boolean Flag

​Feature Badges

​Verification Status

​Priority Levels

Introduction

Available Methods

Icon Configuration

Boolean Mode

Multiple Icons

Examples

Status Indicator

Boolean Flag

Feature Badges

Verification Status

Priority Levels