KAUI CSS KitComponent Showcase

Toast Notifications (.k-toast)

Floating contextual alerts positioned in .k-toast-container with auto-dismiss triggers.

Settings Saved
User interface preferences synchronized.

Usage guide & code sample

Place toasts in one position-specific container and add aria-live="polite". Choose auto-dismiss or keep a close button for persistent messages.

<div class="k-toast-container k-toast-container--top-right" aria-live="polite">
  <div class="k-toast k-toast--success">
    <div class="k-toast__title">Saved</div>
    <div class="k-toast__body">Preferences updated.</div>
  </div>
</div>