Что произошло
Разработчик shadcn представил обновлённую версию своей UI-библиотеки для React. В отличие от большинства аналогичных решений (Material UI, Ant Design), это не npm-пакет, а коллекция отдельных компонентов, которые можно скопировать и доработать под свои нужды.
Детали
- Архитектура: Каждый компонент — это отдельный файл с TypeScript-кодом, стилями и примерами использования. Вы берёте только то, что нужно.
- Кастомизация: Все компоненты используют CSS-переменные — дизайн легко подстроить через общий конфиг.
- Состав: 20+ базовых элементов (кнопки, карточки) + сложные композиции (дашборды, таблицы с сортировкой).
- Документация: Для каждого компонента есть live-демо и варианты состояний (активный, disabled и т.д.).
«Start here then make it your own» — философия проекта: начать с готового и адаптировать.
Для кого
Идеально подходит:
- Небольшим командам без dedicated дизайнера
- Проектам с уникальными требованиями к интерфейсу
- Тем, кто хочет избежать «шаблонного» вида из коробки
Почему это важно
- Контроль: Нет зависимости от обновлений библиотеки — вы сами решаете, когда менять компоненты.
- Производительность: Нет лишнего кода — подключаете только используемые элементы.
- Гибкость: Можно смешивать с другими решениями (например, взять только модальные окна).
Что дальше
Автор активно развивает экосистему:
- Добавляет шаблоны типовых страниц (лендинги, админки)
- Интегрирует с популярными инструментами (Next.js, Vercel)
- Разрабатывает генератор тем оформления
Проект уже используют 119k разработчиков — стоит попробовать, если устали от ограничений стандартных UI-китов.
Это разбор
Самостоятельный разбор новости. Оригинал на ui.shadcn.com — по ссылке ниже.
Источники
- Оригинал: ui.shadcn.com — © ui.shadcn.com