Блог
Дизайн-системы
Как связать дизайн-токены Figma с кодом — Часть 1
Узнайте, как связать переменные Figma с Angular-проектом и синхронизировать дизайн-систему с помощью Style Dictionary.
Ты не можешь построить дизайн-систему на Tailwind — Часть 1
Tailwind отлично подходит для прототипов. Но когда проект растёт, его основная концепция становится именно той причиной, по которой ваша дизайн-система разваливается.
Практическое руководство по иконкам в веб-проектах — Часть 2
Узнайте о недостатках иконочных шрифтов и почему SVG-спрайты — лучшая из возможных альтернатив. Практическая структура для масштабируемых веб-проектов.
Практическое руководство по иконкам в веб-проектах — Часть 1
Узнайте, как создать собственный шрифт с иконками из SVG-файлов и интегрировать его в Angular-проект с помощью Fantasticon.
Как использовать любой CSS-фреймворк в проекте — Часть 5
Компоненты Bootstrap удобны, но не всегда идеально вписываются в дизайн вашего проекта. Чтобы избежать хаоса и ручного редактирования каждого компонента, важно выстроить систему кастомизации.
Как использовать любой CSS-фреймворк в проекте — Часть 4
В этой части мы рассматриваем процесс кастомизации кнопки Primary в Bootstrap с точки зрения построения дизайн-системы. Пошагово описаны уровни кастомизации, а также способы внесения изменений через переменные и стили для сохранения чистой архитектуры.
Как использовать любой CSS-фреймворк в проекте — Часть 3
В этой части речь пойдёт о работе с цветовыми переменными: как извлечь цветовую палитру, переиспользовать её и упростить дальнейшую разработку и поддержку вашего проекта.
Как использовать любой CSS-фреймворк в проекте — Часть 2
Узнайте, как структурировать ваши SCSS-файлы и использовать переменные Bootstrap по всему Angular-проекту для масштабируемых и настраиваемых дизайн-систем.
Как использовать любой CSS-фреймворк в проекте — Часть 1
При интеграции CSS-фреймворков или UI-библиотек часто подключают готовые сборки, но такой подход ограничивает возможности кастомизации и увеличивает размер проекта.