Update README with Space configuration

README.md

@@ -1,34 +1,48 @@
-# Image to Code Generator 🎨
+---
+title: Gemini Image to Code
+emoji: 🌠
+colorFrom: blue
+colorTo: purple
+sdk: docker
+app_port: 7860
+pinned: false
+---
 
-![image-to-code-sketch](./readme/smoke.gif)
+# Gemini Image to Code
 
-Get started with p5js sketches using Gemini 2.0 Flash. Upload any photo, and this web app uses Gemini 2.0 Flash to generate a p5.js sketch that captures the essence of the image in an interactive way.
+A web application that uses Google's Gemini Pro Vision model to convert images into code. Upload an image and get the corresponding HTML/CSS code that recreates the design.
 
-## Getting Started
+## Features
 
-### 1. Clone this repository and install dependencies:
+- Image to code conversion using Gemini Pro Vision
+- Real-time code preview
+- Support for various image formats
+- Modern, responsive UI
+- Code syntax highlighting
 
-```
-git clone https://github.com/googlecreativelab/gemini-demos/
-cd image-to-code-sketch
-npm install
-```
+## Environment Variables
 
-### 2. Create a .env.local file with your AI Studio API key:
+The following environment variables are required:
 
-Get your API key from [Google AI Studio](https://aistudio.google.com/apikey).
+- `GEMINI_API_KEY`: Your Google Gemini API key
 
-```
-GEMINI_API_KEY=your_api_key_here
-```
+## Development
 
-### 3. Start the development server:
+To run this project locally:
 
-```
+```bash
+npm install
 npm run dev
 ```
 
-Open http://localhost:3000 and start uploading images!
+## Docker
+
+To run with Docker:
+
+```bash
+docker build -t gemini-image-to-code .
+docker run -p 7860:7860 -e GEMINI_API_KEY=your_key_here gemini-image-to-code
+```
 
 ## Prompt Transparency
 
@@ -68,7 +82,6 @@ Complete all of these steps. When you write your code, be sure to leave clear co
 Do not EVER try to load in external images or any other libraries. Everything must be self contained in the one file and code snippet.
 
 And don't be too verbose.
-```
 
 ## Credits