Filament HUB
Hero background

Branding

Transform your Filament admin panels from generic interfaces into branded experiences that reflect your organization's identity. Filament 4.x provides comprehensive branding capabilities that go far beyond simple logo replacement - you can customize colors, typography, icons, and complete visual themes while maintaining the framework's performance and accessibility standards. From simple logo swaps to complete visual overhauls with custom color palettes and fonts, these branding tools ensure your admin panels feel distinctly yours while preserving Filament's excellent user experience.

# Simple text-based branding

Simple text-based branding

Replace Filament's default app name with your custom brand name in the header. Perfect for quick branding when you don't need a custom logo but want to personalize the interface with your organization's name or product title.

use Filament\Panel;

public function panel(Panel $panel): Panel
{
    return $panel
        // ...
        ->brandName('Koto Admin Portal');
}

# Asset-based logo integration

Asset-based logo integration

Replace the default text logo with your company's visual identity using image files. Supports all common web image formats including SVG, PNG, and JPG. The asset helper automatically generates the correct public URL path for your logo files.

use Filament\Panel;

public function panel(Panel $panel): Panel
{
    return $panel
        // ...
        ->brandLogo(asset('images/company-logo.svg'))
        ->darkModeBrandLogo(asset('images/logo-dark.svg')) // Custom version for dark mode
        ->brandLogoHeight('3rem'); // Custom sizing
}

# Favicon customization

Favicon customization

Set a custom favicon that appears in browser tabs and bookmarks, completing your brand identity beyond just the admin interface. Use your company's icon or a simplified version of your logo for best results.

use Filament\Panel;

public function panel(Panel $panel): Panel
{
    return $panel
        // ...
        ->favicon(asset('images/favicon.png'));
}

# Typography customization

Typography customization

Replace the default Inter font with your brand's typography from Google Fonts. Typography plays a crucial role in brand recognition and can significantly impact the perceived personality of your admin interface.

use Filament\Panel;

public function panel(Panel $panel): Panel
{
    return $panel
        // ...
        ->font('Nunito'); // Any Google Font
}