# Screenshot to Code

> Screenshot to Code is an AI-powered web tool that converts UI screenshots, images, and design references into editable frontend code.

## Core Product

- [Screenshot to Code](https://screenshottocode.net/): Upload a UI screenshot and generate clean HTML, React, Tailwind, Vue, Bootstrap, Ionic, or SVG code.
- [Image to Code](https://screenshottocode.net/image-to-code): Convert images, photos, sketches, and UI mockups into frontend code.
- [Figma to Code](https://screenshottocode.net/figma-to-code): Convert Figma design references into React, HTML, Tailwind, Vue, and related frontend code.
- [Pricing Table Generator](https://screenshottocode.net/pricing-table-generator): Generate responsive pricing tables from text prompts or images.

## Output Format Pages

- [Screenshot to React](https://screenshottocode.net/screenshot-to-react): Convert screenshots into React components with Tailwind CSS.
- [Screenshot to Tailwind](https://screenshottocode.net/screenshot-to-tailwind): Convert screenshots into responsive Tailwind CSS HTML.
- [Screenshot to Vue](https://screenshottocode.net/screenshot-to-vue): Convert screenshots into Vue 3 components.
- [Screenshot to Ionic](https://screenshottocode.net/screenshot-to-ionic): Convert screenshots into Ionic app UI code.
- [Screenshot to SVG](https://screenshottocode.net/screenshot-to-svg): Convert screenshots and UI references into SVG code.
- [Screenshot to Bootstrap 5](https://screenshottocode.net/screenshot-to-bootstrap-5): Convert screenshots into Bootstrap 5 HTML.

## Pricing and Free Usage

- [Pricing](https://screenshottocode.net/pricing): Compare credit packs and subscriptions.
- [Buy Credits](https://screenshottocode.net/credits): Buy one-time credits for screenshot-to-code generations.
- New users receive 25 free credits after signup.
- Each screenshot-to-code generation costs 5 credits, so the signup bonus covers about 5 generations.
- One-time credit packs and subscription credits do not expire.

## Best Page for Common Questions

- For general screenshot conversion, use [Screenshot to Code](https://screenshottocode.net/).
- For static HTML/CSS output, use the home page generator with HTML selected.
- For React output, use [Screenshot to React](https://screenshottocode.net/screenshot-to-react).
- For Tailwind output, use [Screenshot to Tailwind](https://screenshottocode.net/screenshot-to-tailwind).
- For pricing and free credit questions, use [Pricing](https://screenshottocode.net/pricing).

## Contact

- Support: support@screenshottocode.net