Components

These components demonstrate how to build scalable semantic UI with TailUI.

Toast

Notification toasts with variants and auto-dismiss.

Preview

✓

Success

Changes saved successfully.

Error

Something went wrong.

ℹ

Info

New update available.

Code

1<div class="ui-toast ui-success">
2  <div class="ui-title">Success</div>
3  <div class="ui-message">Changes saved successfully.</div>
4</div>
5
6<div class="ui-toast ui-danger">
7  <div class="ui-title">Error</div>
8  <div class="ui-message">Something went wrong.</div>
9</div>
10
11<div class="ui-toast ui-info">
12  <div class="ui-title">Info</div>
13  <div class="ui-message">New update available.</div>
14</div>