.kairoz-skeleton
Skeleton
Animated placeholder that mirrors the shape of incoming content. Size it inline; the shimmer handles the rest.
Default
<div style="display:flex;flex-direction:column;gap:8px;width:360px"> <div class="kairoz-skeleton" style="height:12px;width:40%"></div> <div class="kairoz-skeleton" style="height:12px;width:80%"></div> <div class="kairoz-skeleton" style="height:12px;width:65%"></div> <div class="kairoz-skeleton" style="height:12px;width:90%"></div> </div>
Card loading state
<div class="kairoz-card" style="width:280px">
<div class="kairoz-card-header"><div class="kairoz-skeleton" style="height:10px;width:80px"></div></div>
<div class="kairoz-card-body">
<div class="kairoz-skeleton" style="height:24px;width:60%;margin-bottom:8px"></div>
<div class="kairoz-skeleton" style="height:10px;width:40%"></div>
</div>
</div>