Spax AI is a fully-featured, cloud-synced, and highly customizable AI web assistant built from scratch. It offers a premium ChatGPT-like experience with voice input, file analysis, and Google authentication, all powered by a free, globally-hosted backend.
- Dark & Light Modes: Seamlessly switch themes.
- Persistent Chat History: Save, rename, and manage multiple conversations.
- Markdown & Code Rendering: Beautiful formatting with syntax highlighting and one-click "Copy Code" buttons.
- Fully Responsive: Looks perfect on desktop, tablet, and mobile.
- Streaming Responses: Text appears word-by-word in real-time.
- Voice Input: Click the microphone to dictate your messages (Web Speech API).
- File Uploads: Upload
.txt,.pdf,.csv,.json, and images for the AI to analyze. - Multi-Model Support: Easily switch between Llama 3.3 (via Groq), GPT-4, or any OpenAI-compatible API directly from the UI.
- Google Sign-In: Securely log in with your Google account via Firebase.
- Cloud Sync: Your chats, settings, and profile automatically sync to Firestore, accessible from any device.
- Customizable Profile: Change your display name and avatar emoji.
Spax AI is split into three main components:
- Frontend (
index.html): A single-page application (SPA) built with Vanilla JS, handling the UI, local storage, Firebase auth, and streaming. Hosted on GitHub Pages. - Backend (
main.py): A Python FastAPI server that acts as a secure middleman. It takes your prompt, attaches the API key, talks to the AI provider, and streams the response back. Hosted on Hugging Face Spaces. - Database & Auth: Firebase handles Google Authentication and stores user data (chats/settings) in a NoSQL Firestore database.
Spax AI has a dedicated mobile-optimized UI! Open mobile.html on your phone and add it to your home screen for a native app experience.
Mobile Features:
- Bottom navigation bar
- Swipe gestures for chat history
- Floating action button
- Full-screen modals
- PWA installable (Add to Home Screen)
- Safe area support for notches
- Voice input optimized for mobile
Want to run your own version of Spax AI? Follow these steps!
No credit card required!
- Create a new Space on Hugging Face and select the Docker SDK.
- Upload the following files from this repository:
main.py(The FastAPI backend)requirements.txt(Python dependencies)Dockerfile(Container instructions)
- Go to Settings -> Variables and secrets and add your AI API Key:
- Name:
API_KEY| Value: Your Groq or OpenAI API key.
- Name:
- Create a project in the Firebase Console.
- Authentication: Go to Build -> Authentication -> Sign-in method. Enable Google.
- Firestore: Go to Build -> Firestore Database. Create a database in Test Mode.
- Web App: Click the
</>icon to register a web app. Copy thefirebaseConfigobject.
- Open
index.htmlin a text editor. - Find the
firebaseConfigobject (around line 450) and paste the credentials you copied from Firebase. - Find the
state.settings.apiUrland paste your Hugging Face backend URL (e.g.,https://your-username-spax-ai.hf.space/chat). - Push
index.htmlto your GitHub repository. - Go to your repo Settings -> Pages and deploy the
mainbranch.
You don't need to touch the code to change how Spax AI behaves! Once the app is running, click the Settings gear icon in the bottom left of the sidebar.
- Backend Endpoint: Change where the app sends requests.
- API Key & Base URL: Switch between Groq, OpenAI, or local models (like Ollama).
- Model: Type the exact model name (e.g.,
llama-3.3-70b-versatile,gpt-4o-mini). - System Prompt: Change Spax AI's personality and instructions.
- Frontend: HTML5, CSS3, Vanilla JavaScript
- Libraries: Marked.js (Markdown), Highlight.js (Code), Firebase SDK (Auth/DB)
- Backend: Python 3.10, FastAPI, Uvicorn, OpenAI Python SDK
- Hosting: GitHub Pages (Frontend), Hugging Face Spaces (Backend)
This project is open source and available under the MIT License.
Built with ❤️ using FastAPI, Firebase, and Vanilla JS.