DLS-Lead — Продакшн-Ready Дизайн-Система

DLS-Lead — це повноцінна дизайн-система, а не просто Figma-файл зі стилізованими прямокутниками. Вона з'єднує дизайн із кодом через структуровану 4-рівневу архітектуру токенів, забезпечуючи консистентність від примітивів до рішень на рівні компонентів.

Що входить:

100+ Figma-компонентів з auto-layout, варіантами та component properties — від Button та Input до Table, Calendar і Chart. Кожен компонент покриває всі стани взаємодії: default, hover, active, disabled, focus.

4-рівнева DTCG-сумісна архітектура токенів: Primitives → Semantics → State → Component. Кольори, типографіка, відступи, тіні та elevation — все структуровано і готове до експорту.

Світла та темна теми на основі семантичних токенів — перемикання тем через один рівень, без змін у кожному компоненті окремо.

Layout-примітиви — Sidebar, Top Bar, Forms та page shells для побудови повноцінних інтерфейсів.

React-бібліотека компонентів — кожен Figma-компонент закодований і доступний у Storybook.

Повна документація — референси токенів, гайдлайни використання та API-документація компонентів.

Обери свою версію:

Community (Безкоштовно) — Всі токени 4 рівнів, 10 основних компонентів (Button, Input, Checkbox, Badge, Alert, Avatar, Tooltip, Separator, Kbd, Switcher), доступ до документації, Storybook, GitHub-пакет токенів. Світла тема.

Pro ($79) — Все з Community плюс всі 100+ компонентів з повним набором варіантів, layout-примітиви, шаблони сторінок, темна тема, 12 місяців оновлень та підтримка.

Для кого:

Для дизайнерів-фрілансерів, які хочуть структурований старт замість перебудови компонентів для кожного проєкту. Для невеликих продуктових команд, де дизайнери й розробники мають працювати з одного джерела правди. Для тих, хто вивчає дизайн-системи і хоче розібратися в реальній мультирівневій архітектурі токенів. Для стартапів, яким потрібна production-ready UI-основа без місяців розробки.

Створено Надією — дизайнеркою дизайн-систем з 2012 року, фракційним партнером з дизайн-систем для SaaS-команд на dlslead.com.

→ Документація: docs.dlslead.com

→ Storybook: storybook.dlslead.com

→ GitHub: github.com/Nadiyq/DLS-Lead