Repolode
deeplethe

deeplethe/solid-glass

Дизайн-система для AI-приложений: совместимые с shadcn/ui стили и компоненты с выразительной отделкой под матовое стекло.

Звёзды
2,042
Форки
42
Открытые issues
5
Последний коммит
7 дней назад

Что это?

Solid Glass — дизайн-система для AI-приложений на базе shadcn/ui, Tailwind CSS 4 и React 19. Она поставляется в виде единого stylesheet, который переоформляет существующие компоненты shadcn/ui по их атрибутам data-slot и именам классов, поэтому менять уже используемые в проекте компоненты не нужно.

Визуальный стиль занимает промежуточное положение между плоским дизайном и liquid glass: поверхности получают тонкие блики по краям, узкие границы и мягкие тени, поэтому выглядят как цельный материал, а не прозрачные панели. Цель — создать спокойный интерфейс, в котором текст остаётся читаемым, пока на экране отображаются потоковые ответы, работающие агенты и ожидающие решения.

Помимо базового оформления, проект предлагает собственные компоненты для интерфейсов агентов: индикатор статуса, composer, списки шагов инструментов, diff-представление, карточку вопроса, кольцевой индикатор использования контекста, уведомления о задачах и блок рассуждений. В проект также входят страница Create для настройки переменных темы и набор примеров экранов, которые можно установить через shadcn CLI.

Ключевые возможности

  • 01Единый stylesheet переоформляет существующие компоненты shadcn/ui без изменений кода.
  • 02Поддерживаются светлая и тёмная темы; основная — тёмная.
  • 03На странице Create можно настраивать переменные темы, например толщину, оттенок, радиус и размытие.
  • 04Компоненты для интерфейсов агентов: статус хода, шаги инструментов, diff-представление и карточка запроса.
  • 05Установка через shadcn CLI из реестра репозитория.

Сценарии использования

  • Создание интерфейса чата или агента на базе существующего проекта shadcn/ui.
  • Читаемое отображение потокового вывода LLM, вызовов инструментов и ожидающего ввода от пользователя.
  • Создание единой визуальной темы для AI-продукта без написания CSS с нуля.

В подборках

Темы

Частые вопросы

Что такое solid-glass?
Дизайн-система для AI-приложений: совместимые с shadcn/ui стили и компоненты с выразительной отделкой под матовое стекло. Solid Glass — дизайн-система для AI-приложений на базе shadcn/ui, Tailwind CSS 4 и React 19. Она поставляется в виде единого stylesheet, который переоформляет существующие компоненты shadcn/ui по их атрибутам data-slot и именам классов, поэтому менять уже используемые в проекте компоненты не нужно.
solid-glass можно использовать бесплатно? Какая у него лицензия?
solid-glass распространяется с открытым исходным кодом под лицензией MIT. Перед использованием в коммерческих продуктах проверьте условия лицензии.
solid-glass всё ещё поддерживается?
Активно поддерживается. Последний коммит в solid-glass — 31 окт. 2026 г..
Для чего можно использовать solid-glass?
Создание интерфейса чата или агента на базе существующего проекта shadcn/ui. Читаемое отображение потокового вывода LLM, вызовов инструментов и ожидающего ввода от пользователя. Создание единой визуальной темы для AI-продукта без написания CSS с нуля.
Где скачать solid-glass?
Исходный код и инструкции по установке — на GitHub: https://github.com/deeplethe/solid-glass

Описание создано ИИ на основе README проекта. Статистика GitHub обновляется ежедневно.

Похожие проекты

Линтер для Tailwind-дизайн-систем, ориентированный на AI-агентов: задавайте допустимые правила стилизации и получайте исправления на основе компонентов и темы проекта.

3,3 тыс.+29 за неделю72TypeScriptMITАктивно поддерживаетсяОбновлён 5 дней назад

Демонстрационный проект с открытым исходным кодом на Next.js, воссоздающий Intelligent UI из ChatGPT: ответы модели выводятся потоком в виде интерактивных карт, диаграмм, форм и работающих инструментов на базе OpenUI.

949+65 за неделю84TypeScriptMITОбновлён вчера