Empty state
An empty state fills a blank view with a short message and an action, so nothing on screen still guides the reader.
<div class="empty">
<p class="icon">📭</p>
<h3>No messages yet</h3>
<p>When you get a message it shows here.</p>
</div>An empty state
Add class="empty" to a centred block with an icon, a line, and an action.
<div class="empty">
<p class="icon">📭</p>
<h3>No messages yet</h3>
<p>When you get a message it shows here.</p>
<p><a class="button" href="#">Write one</a></p>
</div>