lobehub/lobe-ui

Lobe UI

React UI Kit для веб-приложений AI-Native

Библиотека компонентов React с открытым исходным кодом LobeHub для создания чата AI и веб-приложений AIGC.

Документы · Changelog · [Report Bug] [github-issues-link] · [Request Feature] [github-issues-link]

Таблица содержания

##############

Почему Lobe UI?

• Начало работы Развитие на основе ИИ
• Точки входа
• Документация Сообщество ️ Местное развитие
• but Вклад
• Спонсор
• Ссылки

#######

Why Зачем нужен Lobe?

Lobe UI - это библиотека компонентов React за LobeHub, предназначенная для создания чата AI и веб-приложений AIGC.

Built for AI apps: визуализация LLM-выхода (Markdown, код, диаграммы Русалки, дифференциации, превью HTML) и интерфейсы судового чата без создания их с нуля. ** От целевой страницы до консоли администратора : один язык дизайна в чате, панели инструментов, таблицы данных, формы и маркетинговые страницы. Тема в одной строке: светлый и темный режимы плюс первичный и нейтральный цветовой переключатель с одним атрибутом, без вспышки на первой нагрузке. ** Легко рестайлинг: стабильные названия классов позволяют переопределить любой компонент с помощью обычного CSS или Tailwind. Готовы для пользователей: Английские и упрощенные китайские тексты.

✨ Why Lobe UI?

Lobe UI is the React component library behind LobeHub, made for building AI chat and AIGC web apps.

• Built for AI apps: render LLM output (Markdown, code, Mermaid diagrams, diffs, HTML previews) and ship chat interfaces without building them from scratch.
• From landing page to admin console: one design language across chat, dashboards, data tables, forms and marketing pages.
• Theme in one line: light and dark modes plus primary and neutral colors switch with a single attribute, with no flash on first load.
• Easy to restyle: stable class names let you override any component with plain CSS or Tailwind.
• Ready for global users: English and Simplified Chinese texts included.
• AI-native docs: coding agents read every component’s usage and props through skills.md and llms.txt.

🚀 Getting Started

[![][pnpm-shield]][pnpm-link]

$ pnpm add @lobehub/ui @lobehub/icons @lobehub/fluent-emoji motion

Lobe UI is ESM only and needs React 19, motion 13 or 14, @lobehub/icons 6 and @lobehub/fluent-emoji 5 as peer dependencies.

import '@lobehub/ui/theme.css';
import '@lobehub/ui/style.css';

import { Button, ConfigProvider } from '@lobehub/ui';
import { motion } from 'motion/react';

export default () => (