HomeUI Components
Preview
css
NEW
BETA
PRO
Design
UI
Kod
CSS
Code
css
.badge {
  display: inline-flex; align-items: center; gap: 0.375rem;
  padding: 0.25rem 0.625rem; border-radius: 9999px;
  font-size: 0.6875rem; font-weight: 500;
  letter-spacing: 0.06em; text-transform: uppercase;
}

.badge-default  { background: var(--border); color: var(--muted); }
.badge-accent   { background: var(--accent-dim); color: var(--accent); border: 1px solid rgba(196,100,10,.25); }
.badge-success  { background: rgba(34,197,94,.1); color: #16A34A; }
.badge-warning  { background: rgba(245,158,11,.1); color: #D97706; }
.badge-error    { background: rgba(239,68,68,.1); color: #DC2626; }
.badge-dot::before {
  content: ''; display: block;
  width: 6px; height: 6px; border-radius: 50%; background: currentColor;
}
Related Blocks
css
Button Family
Primary, secondary, ghost, destructive variants.
css
Input Fields
Text, email, password, textarea + error/success states.
css
Skeleton Loader
Skeleton interface shown while content is loading.