MANTRIX is an AI-powered web chatbot that supports both English and Hindi conversations and allows users to upload images for AI analysis. Built using HTML, CSS, and JavaScript, it integrates Google Gemini API to deliver smart, natural replies and interpret uploaded visuals.
- 🌐 Multilingual chat (English + Hindi)
- 🖼 Image upload with AI-based description
- 🤖 Powered by Google Gemini (gemini-2.0-flash)
- 💬 Real-time chat interface with loading animation
- 📱 Mobile responsive design
- 🔄 Auto scroll and smooth UX
- Frontend: HTML5, CSS3, JavaScript
- AI Engine: Google Gemini API (v1beta)
- Image Handling: FileReader + Base64 encoding
- Communication: Fetch API for API calls
📦 MANTRIX-Chatbot ├── index.html # Main chatbot interface ├── index1.html # Link page with references ├── script.js # Core chatbot logic ├── style.css # (Optional) Stylesheet ├── ai.png # AI avatar ├── user.png # User avatar ├── img.svg # Upload button icon ├── submit.svg # Submit button icon └── loading.webp # Loading animation
- User types a message or uploads an image.
- JavaScript captures the input.
- If an image is uploaded, it is converted to Base64.
- Message and image (if any) are sent to Gemini API.
- The API returns a smart response, shown in the chat.
- Chat auto-scrolls to show the latest conversation.