Export & Code Generation

Export to SVG, React/Tailwind, React/CSS-Modules, Flutter, and SwiftUI. PDF export with CMYK support.

What It Is

Varve's code generation system exports scene documents to multiple formats including SVG, React with Tailwind CSS, React with CSS Modules, Flutter, and SwiftUI. The print production system supports PDF export with CMYK, bleed, crop marks, and color bars for professional print workflows.

For page-based print work, Print Production adds design-time trim and bleed guides so the production area stays visible while you design.

The Varve advanced export dialog showing a destination and filename template, flat/by-format/by-node organization, and format options including SVG, PNG, WebP and PDF in the adjacent Quick Export panel
Set a destination and filename template, then export to SVG, PNG, WebP, or PDF.

Key Capabilities

  • SVG export: Full SVG export with shapes, paths, text, and transforms
  • React/Tailwind: Export to React components with Tailwind CSS utility classes
  • React/CSS-Modules: Export to React components with CSS Modules
  • Flutter: Export to Flutter/Dart code
  • SwiftUI: Export to SwiftUI code
  • PDF export: PDF/X-1a and PDF/X-4 support with CMYK, bleed, crop marks, color bars
  • Design-time bleed: Page-level bleed values, trim/bleed overlays, and PDF/X page-box parity
  • Print production: Bleed config, safe area, slug, swatches, spot colors
  • Export settings: Per-node export settings for different output formats

Technical Depth

Code generation is implemented in packages/codegen/src/index.ts with functions for SVG export (exportDocumentToSvg, nodeToSvg), React/Tailwind JSX export (exportDocumentToReact), and utility functions for color conversion (rgba), affine transformations (affineToSvg), XML escaping (escapeXml), and shape vertex conversion (shapeVerticesToPoints).

PDF export is implemented in varve-print (Rust) with lopdf-based export_pdf supporting rect, circle, ellipse, line, polygon, and star path operators. The print production system includes color management with ICC profiles and rendering intents for PDF/X compliance.

Limitations

Current limitations:

  • High-DPI export not implemented
  • Print bleed and trim guides are available in the canvas; exported trim and bleed geometry remains the final authority
  • Interactive animation export is a stub (CSS, Lottie, SVG, and video work)

Status

Built

Code generation, PDF export, multi-page documents, facing pages, and print guide configuration are functional. High-DPI export remains deferred.

Ready to export?

Download Varve