Notice

Block-level notification messages and flash banners.

Notice

Default notice with important information.

<div class="kit-notice">Default notice with important information.</div>

Notice variants

Operation completed successfully.

Please review before proceeding.

An error occurred.

Here is some useful information.

Dark notice style.

<div class="kit-notice -success">Operation completed successfully.</div>
<div class="kit-notice -warning">Please review before proceeding.</div>
<div class="kit-notice -danger">An error occurred.</div>
<div class="kit-notice -info">Here is some useful information.</div>
<div class="kit-notice -dark">Dark notice style.</div>

Flash

Full-width banner notifications.

Default flash message

Success!

Error occurred

<div class="kit-flash">Default flash message</div>
<div class="kit-flash -success">Success!</div>
<div class="kit-flash -danger">Error occurred</div>