Upload a screenshot and convert it to clean HTML & CSS, including Figma frames. Runs directly with the GPT-4 API no Plus plan needed!
for more Accurate Conversions: Custom-trained AI model with 95% accuracy. Try for Free: Visit Mantiscode.
- Direct API Integration: Utilizes OpenAI GPT-4 API.
- Supported Models: GPT 4o, HTML/CSS.
- Python v3.13.2 or higher.
- Visual Studio Code (VS Code).
-
Clone the repository:
git clone https://github.com/Codeoned/screenshot-to-code.git
-
Navigate to the project directory:
cd screenshot-to-code
-
Install dependencies:
pip install openai argparse
-
Open the Python file "screenshot_to_code.py" in your IDE (VS Code recommended).
-
Locate your image file on your PC and copy its path (e.g.,
C:\Users\dham\OneDrive\Desktop\Screenshot.png
).- Replace the file path on line 197 in the script.
- Ensure file separators are
\
and not/
.
-
Add your OpenAI API key on line 199:
help = "Your OpenAI API key (optional if set as environment variable)"
-
Run the script:
python screenshot_to_code.py
-
Your HTML/CSS code will be generated within 1-2 minutes.
- If you encounter issues, please open a new issue on the GitHub repository.
Contributions are welcome! Feel free to fork the project and submit pull requests.
This project is licensed under the MIT License.