Banner

A full-width, dismissible announcement bar.

🎉 ng-blatui — accessible Angular components, copy & paste.Read more

import { BuiBanner } from 'ng-blatui';

<bui-banner tone="primary" class="rounded-lg">🎉 ng-blatui — accessible Angular components.</bui-banner>

Tones

Heads up — scheduled maintenance tonight at 2am UTC.

Your plan was upgraded to Pro.

Your trial ends in 3 days.

Your payment method failed.

<!-- tone="primary | info | success | warning | danger | default" -->
<bui-banner tone="success">Your plan was upgraded to Pro.</bui-banner>
<bui-banner tone="warning">Your trial ends in 3 days.</bui-banner>