Блог
Руководства, исследования и новости продукта: дизайн-системы, токены и синхронизация дизайна с кодом.
6 мин чтения
Инженерия
Режимы токенов и тёмная тема без дублирования
Тёмная тема не должна быть копией светлой. Держите один набор имён токенов, меняйте только значения и выдавайте режимы в CSS так, чтобы они не расходились.
5 мин чтения
Продукт
Контекст дизайн-системы для ИИ: rules-файлы, MCP и что работает
Три способа рассказать ИИ-агенту о дизайн-системе, где каждый ломается, что выпускают большие публичные системы и какой слой команды пропускают.
4 мин чтения
Дизайн-системы
Dev Mode и Code Connect в Figma: что решают и что нет
Dev Mode и Code Connect помогают разработчикам перейти от дизайна к коду. Что делает каждый, какие тарифы нужны и на какой вопрос не отвечает ни один.
5 мин чтения
Дизайн-системы
Ваш ИИ-агент не знает вашу дизайн-систему
ИИ-агенты пишут интерфейс, который собирается, проходит тесты и тихо обходит дизайн-систему. Как это устроено и какие два слоя держат это под контролем.
4 мин чтения
Инженерия
Как найти зашитые цвета в кодовой базе React
Каждый hex в компоненте выводит его из дизайн-системы. Команды поиска за минуты, ложные срабатывания, которые нужно убрать, и как не пускать новые цвета в код.
5 мин чтения
Дизайн-системы
Аудит дизайн-системы за один вечер
Честная первая картина того, насколько продукт разошёлся с системой, за один вечер: чеклист из двенадцати шагов, команды и форма для результата.
5 мин чтения
Инженерия
SVG-спрайт из Figma и когда он лучше компонентов
Один файл символов вместо компонента на каждую иконку: когда SVG-спрайт выгоднее, как подключить его в React и на чём спотыкаются чаще всего.
6 мин чтения
Инженерия
Иконки из Figma в React: весь путь
От компонента-иконки в Figma до влитого pull request: каждый шаг, что он даёт на выходе, и три формата доставки на настоящем сгенерированном коде.
5 мин чтения
Дизайн-системы
Формат W3C DTCG: что стандарт наконец закрепил
Через шесть лет после создания группы у формата дизайн-токенов есть стабильная версия. Что закрепил 2025.10, чем он отличается от черновика 2022 года и что проверить в своих файлах.
6 мин чтения
Дизайн-системы
Имена токенов: три уровня, которые выживут ребрендинг
Плоские имена вроде blue-500 ломаются при первой смене бренда. Три уровня токенов сохраняют код компонентов нетронутым при ребрендинге и тёмной теме.
6 мин чтения
Инженерия
Style Dictionary на практике: токены в CSS, SCSS и TypeScript
Рабочая настройка Style Dictionary 5 для токенов DTCG, проверенная настоящей сборкой: ссылки, режимы, единицы и эксперимент, в котором переименование тихо ломает CSS.
6 мин чтения
Инженерия
Как отдать переменные Figma разработчикам без тарифа Enterprise
Единственный официальный API для переменных Figma доступен только на Enterprise. Разбираем три пути, которыми переменные выходят из Figma, и где каждый упирается.