Основа

ИконкиIcon

Набор Phosphor: вес, размеры и что нельзя

npx shadcn@latest add @umbra/icon

<Icon as={Microphone} /> рисует иконку Phosphor с правильным весом. Передавать weight не нужно и нельзя: вес выбирается по имени иконки

Когда брать

Для всех иконок интерфейса: в кнопках, строках списка, чипах, сайдбаре

Когда не брать

  • Логотип и маскот: это SVG продукта
  • Индикатор ожидания: только дуга-спиннер без подложки (Spinner)

Встречи

7 записей за неделю

Планёрка командыВТ, 10:00 · 32 мин
Интервью с дизайнеромПН, 16:30 · 48 мин
Созвон с подрядчикомПТ, 12:00 · 21 мин
Разбор макетовЧТ, 11:00 · 54 мин
Ретро спринтаСР, 17:00 · 40 мин
Встреча с юристомСР, 12:30 · 25 мин
Обзор метрикВТ, 15:00 · 36 мин

Можно

  • label="Записать", если иконка единственное содержимое и смысл не подписан рядом
  • Цвет иконки через текст родителя: text-primary-ink, text-indigo-ink, text-muted. Чернила -ink для иконок проходят Lc 45 во всех темах

Нельзя

  • Варианты *Circle и *Square, Subtitles, QuestionMark: в заливке становятся сплошной плашкой
  • Иконки с подложкой, второй набор иконок (lucide и др.), спиннер из иконки
  • Стрелки Arrow* (и CloudArrowUp, ArrowsClockwise): направление только шевроном Caret* bold. Ловит umbra/no-arrow-icons