Enjoying PHPFlasher? Show your support with a star on GitHub! It helps others discover this tool and motivates us to keep improving it. Have ideas or spot a typo? We'd love your contributions to the docs . Thank you

Star

Flasher Theme

The default notification system for PHPFlasher

Success Data has been saved successfully!

Error Oops! Something went wrong!

Warning Are you sure you want to proceed?

Information Welcome back!

Configuration

// config/flasher.php

return [
    'default' => 'theme.flasher',
];

# config/packages/flasher.yaml

flasher:
    default: theme.flasher

// Set as default theme
// Then use it
flasher.use('theme.flasher').success('Well done!');

Usage

When theme.flasher is set as your default theme:

flash()->success('Your changes have been saved!');

For specific notifications:

flash()->use('theme.flasher')->success('This uses Flasher Theme');

When theme.flasher is set as your default theme:

flasher.success('Your changes have been saved!');

For specific notifications:

flasher.use('theme.flasher').success('This uses Flasher Theme');

Key Features

Visual Design

Color-coded borders for quick identification
Progress indicator shows remaining display time
Responsive design works on all screen sizes

Accessibility

Semantic ARIA attributes for screen readers
Keyboard navigation support
RTL language support

Customization

:root {
  --fl-success: #10b981; /* Green */
  --fl-error: #ef4444;   /* Red */
  --fl-warning: #f59e0b; /* Orange */
  --fl-info: #3b82f6;    /* Blue */
}

<div class="fl-flasher fl-[type]" role="[role]" aria-live="[ariaLive]" aria-atomic="true">
    <div class="fl-content">
        <div class="fl-icon"></div>
        <div>
            <strong class="fl-title">Title text</strong>
            <span class="fl-message">Message text</span>
        </div>
        <button class="fl-close" aria-label="Close">×</button>
    </div>
    <span class="fl-progress-bar">
        <span class="fl-progress"></span>
    </span>
</div>

Browser Support

Chrome

Firefox

Safari

Edge

Mobile

Dark Mode

Need assistance?

Documentation Community