 [Penpot](https://penpot.app/) — аналог Figma, інструмент для дизайну інтерфейсів і спільної роботи дизайнерів та розробників. Підтримує створення UI, прототипування та роботу з дизайн-системами, включно з компонентами, варіантами і design tokens. Орієнтований на веб-стандарти: використовує CSS Flex і Grid, дозволяє працювати з власними шрифтами та створювати масштабовані інтерфейси без прив’язки до закритих екосистем.

 Інструмент має інтерактивне прототипування з анімаціями, переходами та сценаріями взаємодії. Реалізована спільна робота в реальному часі, коментарі та поширення прототипів через посилання. Для розробників доступні інспектори коду і властивостей, вимірювання відстаней і готові CSS/SVG-фрагменти. Додатково є база ресурсів, шаблонів і плагінів від спільноти, що спрощує старт і розширення функціональності.

 Можу бути запущений на власному сервері (self-hosted), також користуватися вебсервісом, до 10 файлів по 100 Мб безплатно.

** Схожі пости:
**• [Велика добірка](https://t.me/korysnosti/2337) онлайн[⁠](https://t.me/korysnosti) дошок для роботи та навчання
• Онлайн [векторний редактор](https://t.me/korysnosti/2551)
• [Простий редактор](https://t.me/korysnosti/1180) для редагування та анімації векторної графіки, в т.ч. з форматом TGS

 [Корисності для Ґаджетів](https://t.me/+jDkebHunBN9lN2Vi) 

** Будемо вдячні за:
 [Заряджання каналу](https://t.me/korysnosti?boost) 
 [Запрошення друзів](https://t.me/share/url?url=https%3A%2F%2Ft.me%2F%2B0zeMmDFcBNU0MTli&text=%D0%94%D1%96%D0%BB%D1%8E%D1%81%D1%8C%20%D1%82%D0%BE%D0%BF%D0%BE%D0%B2%D0%B8%D0%BC%20%D0%BA%D0%B0%D0%BD%D0%B0%D0%BB%D0%BE%D0%BC%2C%20%D1%8F%D0%BA%D0%B8%D0%B9%20%D0%BA%D0%BE%D0%B6%D0%BD%D0%BE%D0%B3%D0%BE%20%D0%B4%D0%BD%D1%8F%20%D0%BF%D1%83%D0%B1%D0%BB%D1%96%D0%BA%D1%83%D1%94%20%D0%BF%D1%80%D0%B8%D0%BA%D0%BE%D0%BB%D1%8C%D0%BD%D1%96%20%D0%BC%D0%BE%D0%B1%D1%96%D0%BB%D1%8C%D0%BD%D1%96%20%D0%B0%D0%BF%D0%BA%D0%B8%2C%20%D0%BF%D1%80%D0%BE%D0%B3%D0%B8%2C%20%D1%81%D0%B0%D0%B9%D1%82%D0%B8%2C%20%D0%BD%D0%B5%D0%B9%D1%80%D0%BE%D0%BD%D0%BA%D0%B8%20%D1%96%20%D0%B1%D0%B0%D0%B3%D0%B0%D1%82%D0%BE%20%D1%87%D0%BE%D0%B3%D0%BE%20%D1%89%D0%B5) 

[#prototype](?q=%23prototype) [#ux](?q=%23ux) [#ui](?q=%23ui) [#design](?q=%23design)