© 2026 Hedgehog Software, LLC

TwitterGitHubDiscord
More
CommunitiesDocsAboutTermsPrivacy
Search
Star
Setup for Free
FilamentF
Filament•3w ago•
3 replies
Bonux

Filament fi- and flag-icons package conflicting with the css classes.

✅ Solved4️⃣v4
Project uses;
https://cdn.jsdelivr.net/gh/lipis/flag-icons@7.0.0/css/flag-icons.min.css

Both filament and the flag icons coincidentally use the .fi- prefix, causing the Norwegian flag background-image to be applied to Filament's notification container. Please tell me theres and easy way to change the fi- on filament globally ?

Never did I ever think that this would occur. It just renders out the @livewire('notifications') as Norwegian flag. LMAO never though I would see that conflict.
Solution
I guess it's easier to run Seardh & Replace on the CSS file once.
Jump to solution
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

Conflicting CSS
FilamentFFilament / ❓┊help
12mo ago
fi-badge css
FilamentFFilament / ❓┊help
3y ago
Themes and CSS and Hook Classes
FilamentFFilament / ❓┊help
17mo ago
Filament 4 tailwind css classes take no effect.
FilamentFFilament / ❓┊help
3w ago