© 2026 Hedgehog Software, LLC

TwitterGitHubDiscord
More
CommunitiesDocsAboutTermsPrivacy
Search
Star
Setup for Free
FilamentF
Filament•6mo ago•
15 replies
Mahmoud Elshiha

File Upload Preview Issue

What I am trying to do:
I want to display uploaded images in Filament’s FileUpload field clearly (not blurred or pixelated) when editing a record.

What I did:

Configured FileUpload::make('image') with .directory('question_game_images') and .disk('public').

Images are uploaded correctly and stored in the DB as relative paths (question_game_images/filename.png).

On edit, the image loads in the form preview, and when i open the image in new tap using openable() it shows with full resoultion.

My issue/the error:
The image preview inside the FileUpload form shows as very pixelated/blurred. It looks like Filament is rendering a low-resolution thumbnail instead of the original image.

also the image start with a very small preview window when i click on it , it expands to be like what it is in the attachments

Code:

Forms\Components\FileUpload::make('image')
                                ->label('Image')
                                ->directory('question_game_images')
                                ->image()
                                ->disk('public')
                                ->columnSpanFull()
                                ->downloadable(true)
                                ->openable()
                                ->visible(fn(Get $get) => $get('question_type') === 'image'),
                        ]),
Forms\Components\FileUpload::make('image')
                                ->label('Image')
                                ->directory('question_game_images')
                                ->image()
                                ->disk('public')
                                ->columnSpanFull()
                                ->downloadable(true)
                                ->openable()
                                ->visible(fn(Get $get) => $get('question_type') === 'image'),
                        ]),
image.png
image.png
Filament banner
FilamentJoin
A powerful open source UI framework for Laravel • Build and ship admin panels & apps fast with Livewire
20,307Members
Resources
Was this page helpful?

Similar Threads

Recent Announcements

Similar Threads

File upload preview
FilamentFFilament / ❓┊help
3y ago
preview file after upload
FilamentFFilament / ❓┊help
15mo ago
File upload preview green gradient
FilamentFFilament / ❓┊help
2y ago
File Upload Issue
FilamentFFilament / ❓┊help
16mo ago