Skip to main content
← Back to Table of Contents

​
Summary

Read-only table column for displaying blade-icons values stored by IconPickerField. Renders the SVG icon with optional human label, technical name, semantic color, and size tokens shared with the flex-field design system.
ClassBjanczak\FilamentFlexFields\Filament\Tables\Columns\IconColumn
ContextFilament tables ($table->columns([...]))
State typestring|null — full icon name (e.g. heroicon-o-star)
ParentFilament\Tables\Columns\TextColumn
Playgroundicon-column slug in Flex Fields playground
Import alias: Filament ships its own IconColumn. When you need both, alias this class: use Bjanczak\FilamentFlexFields\Filament\Tables\Columns\IconColumn as FlexIconColumn;

​
Basic usage

​
Standard Icon

use Bjanczak\FilamentFlexFields\Filament\Tables\Columns\IconColumn;

IconColumn::make('menu_icon')
    ->label('Icon');

​
Labeled Status Icon

IconColumn::make('status_icon')
    ->iconColor('success')
    ->iconSize('lg')
    ->showLabel();

​
Configuration API

All methods accept Closure unless noted.
MethodTypeDefaultDescription
iconSize(string $size)Setup'md'sm, md, lg
iconColor(string|array $color)SetupnullSemantic Filament color
showLabel(bool $condition)SetupfalseShow human-readable label
showName(bool $condition)SetupfalseShow technical icon name
labelUsing(Closure $callback)SetupdefaultCustom label resolver

​
Real-world examples

IconColumn::make('icon')
    ->iconSize('md')
    ->iconColor('primary')
    ->showLabel();

​
Debug / Developer View

IconColumn::make('debug_icon')
    ->iconSize('sm')
    ->showLabel()
    ->showName()
    ->tooltip(fn ($state) => $state);

​
Performance

  • SVG Cache: Server-side SVG HTML is cached to prevent repeated disk lookups.
  • Render Cache: Per-request caching of rendered column HTML.
  • Lazy CSS: Stylesheets are loaded only when the column renders.

​
Playground

/admin/flex-fields-playground/icon-column See Playground for setup.
ComponentWhen to use instead
IconPickerFieldForm field for selecting icons
UserColumnAvatar and user display column
RatingColumnStar rating display column

​
CSS classes (reference)

ClassRole
fff-icon-columnColumn cell root
fff-icon-column--{sm|md|lg}Size modifiers
fff-icon-column--with-labelIcon + text layout
fff-icon-column__iconSVG wrapper
fff-icon-column__textLabel/name stack
fff-icon-column__labelHuman-readable label
fff-icon-column__nameTechnical icon name