← General Design System

Tag component

İnteraktiv tag — circle (pill · default) & square shape. 5 variant: Primary (brand) · Secondary (grey) · Tertiary (primary-900 fill) · Outline (grey) · Inverse × 3 ölçü × type (default · dot · leftIcon · rightIcon ×close), tam interaksiya halları (hover · focus · active · disabled) + selected (✓). Rənglər/ölçülər design token-lərindən. Statik etiket → Badge.

Variants

5 variant · md · leftIcon · Inverse tünd fonda

Sizes

sm · md · lg · primary · height 28 / 32 / 36px

Shapes

circle (pill · default) · square (radius-md · 8px) · sm · md · lg · primary

Types

default · dot · leftIcon · rightIcon (×close) · md · primary

States

default · hover · focus · active · disabled — hər variant · canlı: fokusla / üstünə gəl

Selected

selected && !disabled → ✓ leading slot-u əvəz edir

Dark mode

tünd səthdə — grey/outline variantları açıq tona, tertiary daha aydın navy-yə uyğunlaşır