Дизайнер рисует иконки в фигме.
С помощью фигма-плагина создаётся пулл-реквест с иконками в репозиторий ui-primitives.
После мёрджа пулл-реквеста в ui-primitives и публикации нового пакета, с помощью github-actions начинается процесс генерации новых реакт-компонентов на основе svg-файлов иконок.
После успешной генерации новых React-компонетов, публикуются новые версии пакетов.

Какие есть пакеты иконок

На данный момент есть следующие пакеты иконок:

Пакет	Ссылка на npmjs.com	Описание
@alfalab/icons	@alfalab/icons	Общий пакет со всеми иконками
@alfalab/icons-classic (old)	@alfalab/icons-classic	Устаревшие иконки
@alfalab/icons-glyph	@alfalab/icons-glyph	Основной стиль иконок для всех продуктов
@alfalab/icons-flag	@alfalab/icons-flag	Иконки флагов стран
@alfalab/icons-logotype	@alfalab/icons-logotype	Логотипы
@alfalab/icons-corp	@alfalab/icons-corp	Используются только в продуктах корпоратов
@alfalab/icons-rocky	@alfalab/icons-rocky	Иконки в новом стиле
@alfalab/icons-ios	@alfalab/icons-ios	Используются только на iOS устройствах
@alfalab/icons-android	@alfalab/icons-android	Используются только на Android устройствах

Как импортить иконки в проект

import { IconName } from '@alfalab/{packageName}/{IconName}';

или

import IconName from '@alfalab/{packageName}/{IconName}';

Цвет иконок

В пакете @alfalab/icons-glyph цвет иконок задается атрибутом fill="currentColor", т.е. цвет наследуется от родительского свойства color.

В пакете @alfalab/icons-classic цвет иконок не наследуется.

FAQs

What is @alfalab/icons?

Is @alfalab/icons well maintained?

Package last updated on 09 Dec 2025

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install