MateChat React is a front-end AI scenario solution UI library based on Huawei DevUI Design, the React version of MateChat, .
English | 简体中文
MateChat React is a React component library designed for AI-driven interfaces, such as chat assistants, prompt tools, agent frameworks, and more. It is the React version of MateChat, offering consistent features and styles.
MateChat is based on Huawei DevUI Design, offering a modern visual language, consistent user experience, and excellent scalability.
For more information, visit the MateChat React website: MateChat React
- Comprehensive Components: Provides a wide range of components tailored for AI scenarios, including chat bubbles, input areas, and conversation lists.
- Customizable Styles: Built with Tailwind CSS, allowing easy customization to fit your design needs.
- Highly Customizable: All components are highly customizable, allowing you to easily adapt them to your specific needs.
- Headless Components: All components are able to use in headless mode through shadcn/ui.
# npm
npm install @matechat/react
# or pnpm
pnpm add @matechat/react-
Initialize shadcn/ui
pnpm dlx shadcn@latest init
-
Install MateChat React components
It is possible to install MateChat React components with shadcn/ui CLI. For example, to install the bubble component of MateChat React:
pnpm dlx shadcn@latest add https://matechat.noctisynth.org/r/bubble.json
The documentation is still in progress, but you can feel free to create a new issue in GitCode or GitHub to submit your questions or suggestions. This project is still under development, so the documentation is not complete yet, some features may change in the future.
For more information, please track the progress in #5.
We welcome all kinds of contributions:
- File issues for bugs or features
- Create pull requests
- Help with documentation or translations
Contributors:
| MateChat React Chat Group | SOA Chat Group |
|---|---|
![]() |
![]() |
This project is licensed under the MIT License.

