Welcome to deep-chat, a modern and responsive AI chatbot interface built using HTML, CSS, and JavaScript, powered by the DeepSeek API via OpenRouter. This lightweight and clean interface replicates a ChatGPT-style experience with full support for markdown, code rendering, session history, dark/light theme, and more.
- 🌗 Dark / Light Theme Toggle
- 📜 Persistent Chat History (Stored in Local Storage)
- ⌨️ Markdown & Code Block Support
- 🔁 New Chat Session with Reset
- 🔍 Searchable Sidebar for Previous Chats
- 🗑️ Delete Old Chat Sessions
- 📱 Fully Responsive for Mobile and Desktop
- 🔒 Environment-safe API Key Handling
- Frontend: HTML, CSS (custom + responsive), Vanilla JavaScript
- API Integration: DeepSeek via OpenRouter
- Markdown Parser: Custom JavaScript renderer with support for:
- Code Blocks
- Bold/Italic/Strikethrough
- Lists & Headings
- Blockquotes & Hyperlinks
-
Clone this repository
git clone https://github.com/CodeWithVedang/deep-chat.git cd deep-chat -
Set up your OpenRouter API key
Create a
.envfile (if using a backend or Vercel) and add:CHAT_API_KEY=your_openrouter_api_key_here
-
Run with Live Server or deploy to Vercel
For development:
npm install -g live-server live-server
deep-chat/
├── index.html # Main HTML structure
├── style.css # All custom and responsive styles
├── script.js # Client-side logic, chat rendering, and theme
├── api/chat.js # Backend API call to DeepSeek via OpenRouter
└── assets/ # (Add your screenshots here)
The chat interface uses the DeepSeek model from OpenRouter:
- Model:
deepseek/deepseek-r1-0528:free - All responses are structured in Markdown and English.
Ensure your API key is kept private and secure (not exposed in the frontend).
Vedang Shelatkar 🔗 GitHub Profile 🧠 Passionate about building intelligent UIs & automation.
This project is open-source and available under the MIT License.
✨ Feel free to fork, contribute, or drop a ⭐ if you like this project!