Update README with Hugging Face Space metadata and formatting

README.md

@@ -1,86 +1,108 @@
-# Multi Image - Image Generation Web App
+---
+title: Multi Image Generator
+emoji: 🎨
+colorFrom: purple
+colorTo: blue
+sdk: docker
+app_file: app.py
+pinned: false
+---
 
-A Next.js web application for generating images using multiple AI providers (OpenAI, Google Generative AI, Qwen).
+# Multi Image Generator
 
-## Features
+A powerful Next.js web application for generating images using multiple AI providers. Generate stunning images with OpenAI DALL-E 3, Google Generative AI, or Qwen - all from one unified interface.
 
-- Multi-provider image generation support
-- Smart model selection based on availability
-- Real-time image generation with progress tracking
-- History management for generated images
-- Dark/Light theme support
-- API key management through settings panel
+## ✨ Features
 
-## Supported Providers
+- 🤖 **Multi-Provider Support** - Use OpenAI, Google Generative AI, or Qwen
+- 🧠 **Smart Model Selection** - Automatically route to the best available provider
+- ⚡ **Real-time Generation** - Watch your images come to life
+- 📜 **Image History** - Keep track of all your generated images
+- 🌓 **Dark/Light Mode** - Comfortable viewing in any lighting
+- 🔐 **Secure API Keys** - Manage your API keys privately through settings
 
-- **OpenAI** - DALL-E 3
-- **Google Generative AI** - Imagen
-- **Qwen** - Qwen Image Generation
+## 🎯 Supported Providers
 
-## Getting Started
+| Provider | Model | Features |
+|----------|-------|----------|
+| **OpenAI** | DALL-E 3 | High-quality, detailed images |
+| **Google** | Imagen 2 | Fast generation, excellent quality |
+| **Qwen** | Qwen Image Gen | Cost-effective, good quality |
 
-### Prerequisites
+## 🚀 Quick Start
 
-- Node.js 18+
-- API keys for at least one of the supported providers
+1. **Visit the Space** and open the application
+2. **Add API Keys** - Click settings and add your API keys for providers you want to use
+3. **Generate Images** - Enter your prompt and watch the magic happen!
 
-### Installation
+### Getting API Keys
 
-1. Clone the repository
-2. Install dependencies:
-```bash
-npm install
-```
-
-3. Set up environment variables:
-```bash
-cp .env.example .env.local
-```
-
-4. Add your API keys to the settings panel in the app
+- **OpenAI**: https://platform.openai.com/api-keys
+- **Google**: https://ai.google.dev
+- **Qwen**: https://dashscope.aliyun.com
 
-### Development
+## 💻 Local Development
 
 ```bash
-npm run dev
-```
-
-The app will be available at `http://localhost:9002`
+# Install dependencies
+npm install
 
-### Build
+# Run development server
+npm run dev
+# App available at http://localhost:9002
 
-```bash
+# Build for production
 npm run build
+
+# Start production server
 npm start
 ```
 
-## Environment Variables
+## 🛠️ Technologies
+
+- **Frontend**: Next.js 15, React 19, TypeScript
+- **Styling**: Tailwind CSS, Radix UI
+- **AI**: Genkit AI, Google Generative AI SDK
+- **Backend**: Next.js API Routes
+- **UI Components**: shadcn/ui
 
-The application uses API keys from the settings panel. No environment variables are required for deployment.
+## 📝 How It Works
 
-## Deployment on Hugging Face Spaces
+1. **Prompt Enhancement** - Your prompt is automatically improved for better results
+2. **Provider Selection** - The app intelligently selects the best available provider
+3. **Image Generation** - Request sent to the selected provider
+4. **Display & History** - Generated images shown with automatic history tracking
 
-This application is configured to run on Hugging Face Spaces using Docker.
+## 🐳 Docker Deployment
+
+This project is configured to run on Hugging Face Spaces using Docker:
 
-1. Create a new Space on Hugging Face (Docker runtime)
-2. Clone this repository into the space
-3. Push to the space:
 ```bash
-git push origin main
+# The Dockerfile handles:
+- Node.js environment setup
+- Dependency installation
+- Next.js build
+- Production server startup on port 7860
 ```
 
-The application will automatically build and deploy.
+## ⚙️ Configuration
+
+All configuration is handled through the UI:
+- API keys are stored locally in your browser
+- No sensitive data is stored on the server
+- Settings are managed via the settings panel
+
+## 📜 License
+
+MIT License - feel free to use this project for personal or commercial purposes.
 
-## Technologies Used
+## 🤝 Contributing
 
-- Next.js 15
-- React 19
-- TypeScript
-- Tailwind CSS
-- Genkit AI
-- Firebase (for features)
-- Radix UI components
+Have ideas to improve Multi Image Generator? Feel free to:
+- Report issues
+- Suggest features
+- Submit pull requests
 
-## License
+## 📧 Support
 
-MIT
+For issues or questions about using the app, please check the settings panel for API key configuration help.