Tutorial 12 · Components

Feedback — Alerts, Badges & Chips

Status, tags and inline feedback — gold, azure, tangerine, viridian.

8 minBeginnerlucUI 2 · v2.1.3

Objectives

  • Differentiate alert variants.
  • Use badges and chips for tags.

Steps

Alerts

Info

For neutral info.

Gold

Accent notice.

alert.html
<div class="luc-alert luc-alert-info">…</div>
<span class="luc-badge luc-badge-gold">New</span>

Badges & chips

GoldAzureChip
← Previous Next →