Morphix AI Assistant Demo
Supports UIby paul-leo
React and TypeScript demo application showcasing AI API integration with a multi-mode chat interface.
What it does
This application serves as a reference implementation for integrating AI APIs into a React frontend. It provides a clean, responsive UI that allows users to interact with AI models in different specialized modes: general chat, translation, and HTML code generation.
Key features
- Tri-Mode Interface: Seamlessly switch between general assistance, professional translation, and structured HTML generation.
- OpenRouter Integration: Demonstrates how to connect to various LLMs using the OpenRouter API.
- Responsive Design: Built with Tailwind CSS 4.x for optimal display on both desktop and mobile devices.
- Type-Safe Implementation: Fully written in TypeScript for robust API handling and state management.
Installation
Since this is a demo frontend app, it is typically run via Node.js:
- Clone the repo
- Run
npm install - Configure your API key in
src/config/ai.ts - Run
npm run dev
Supported hosts
- Claude
Quick install
npm installInformation
- Pricing
- free
- Published
- 4/16/2026
- stars






