Drawably: hand-drawn контролы без зависимостей
Появилась библиотека Drawably для UI-контролов в стиле ручного скетча. Она нужна тем, кто хочет быстро добавить живой, чуть неровный визуал без лишних зависимостей.
Что это такое
Drawably — набор hand-drawn UI controls, которые выглядят как свежий рисунок от руки. Идея простая: каждый mount создаёт новый скетч, так что элементы не выглядят штампованными и одинаковыми.
Внутри уже лежит 25 элементов, 12 вариантов «руки» и 6 чернил. Всё это поставляется в пакете, а дальше можно выбрать понравившийся вариант и зафиксировать его. Остальные библиотека умеет перетасовывать, чтобы весь набор выглядел как работа одной руки.
Что есть в API
У Drawably zero dependencies, MIT-лицензия и версия v0.4.2. Поддерживаются готовые компоненты и для React, и для обычного использования:
- DrawablyButton
- drawablyButton
- drawablyCheckbox
- drawablyInput
- drawablyCard
- drawablyRadio
- drawablyToggle
- drawablyDivider
- drawablyArrow
В примерах есть импорт из drawably/react, а для обычного сценария — drawably и drawably/style.css. У кнопки можно задавать состояния вроде loading и success, а также вариант solid.
Зачем это может пригодиться
Это не про «ещё один UI kit», а про характер интерфейса. Если нужен прототип, лендинг, учебный проект или просто хочется уйти от стерильной геометрии, Drawably даёт быстрый способ добавить немного ручной энергии без долгой возни.
Мой вывод простой: библиотека маленькая, но с очень понятной идеей. Когда интерфейсу не хватает жизни, иногда достаточно не нового компонента, а нового почерка.
Источник: drawably — hand-drawn UI controls
Больше про фронтенд в канале @front_end_dev