🎨 CodeCanvas

Turn your code snippets into beautiful, shareable images.
Perfect for LinkedIn, X (Twitter), and technical blogs.

✨ Features

• Live Preview: See your code highlight in real-time as you type or change settings.
• Syntax Highlighting: Supports multiple languages (JavaScript, HTML, CSS, Python, Java) out of the box using Prism.js.
• Mock Data Generation: Automatically populates realistic mock code examples when you switch languages.
• Customizable Themes: Choose between popular themes like Tomorrow Night, Okaidia, and Solarized.
• Glassmorphism UI: A beautiful, modern interface built with pure Vanilla CSS (no heavy frameworks).
• High-Res Export: Download your snippets as high-quality PNGs, ready to be shared anywhere.

🚀 Tech Stack

• HTML5 for structure
• Vanilla CSS3 (Custom Properties, Flexbox, Glassmorphism)
• Vanilla JavaScript (ES6+)
• Prism.js for Syntax Highlighting
• html2canvas for flawless, high-resolution DOM-to-Image rendering
• Phosphor Icons for beautiful iconography

🛠️ Usage

1. Clone the repository to your local machine.
2. Open index.html in your favorite browser. No local server required!
3. Paste or type your code into the editor window.
4. Select your language, theme, and background gradient from the sidebar.
5. Click Export Image to download your high-quality PNG.

🤝 Contributing

Contributions, issues and feature requests are welcome! Feel free to check the issues page.

📝 License

This project is open source and available under the MIT License.