🚀 Just launchedApple UI design taste for AI agents — create polished UIs using Apple’s design style.Try it now

Exporting Projects

Learn how to export a Windframe project as an image, PDF, or production-ready code for your preferred framework.

Windframe lets you export a project as code, JPEG images, or a PDF. Image and PDF exports are useful when you want to share a design, collect feedback, or keep a visual copy without setting up the exported code.

Open the Export Configuration

Step 1: Sign in to Windframe and open the project you want to export.

Step 2: Save your latest changes, then click Export in the top-right corner of the editor.

Export button in the Windframe editor

The Export Configuration window will open. From here, you can configure a code export or use one of the visual export options.

Export Project Code

Use a code export when you want to continue developing your design outside Windframe.

Step 1: In Export Configuration, choose JavaScript or TypeScript.

Step 2: Select one or more frameworks or markup formats. Available options include HTML, Angular, React, Next, Vue, Nuxt, Svelte, Astro, Solid, EJS, and Rails.

Step 3: Configure any additional options, then click Export Project.

Step 4: In the code export window, select the format you want to view.

Selecting a code export format in Windframe

Step 5: Click the download button to save the generated project files.

Downloading exported project code

You can also use the copy button to copy the generated code directly to your clipboard.

Copying exported code

Export a Project as Images

The image and PDF options are available under Quick Exports at the top of Export Configuration.

Image and PDF quick export options in Windframe

Note: You must be signed in to use Quick Exports. Each download counts toward the export allowance included with your plan.

Step 1: Under Quick Exports, click Export as Image.

Step 2: Keep the export window open while Windframe renders every page in the project. A loading message will appear during this process.

Step 3: The finished export downloads automatically:

  • A single-page project downloads as one JPEG image.
  • A multi-page project downloads as a ZIP file containing one JPEG image for each page. Each image uses its page name as the filename.

Export a Project as a PDF

Step 1: Under Quick Exports, click Export as PDF.

Step 2: Wait while Windframe renders the project. A loading message will remain visible until the PDF is ready.

Step 3: The PDF downloads automatically. For a multi-page project, Windframe combines all project pages into one PDF and labels each design with its page name.

Troubleshooting Quick Exports

  • If an export does not start, confirm that you are signed in and still have exports available on your plan.
  • Make sure images, fonts, and other external assets used by the design are publicly accessible so Windframe can include them in the rendered file.
  • For large or multi-page projects, leave the export window open until the download begins.