All guides

Export

7 min read

How to export logos, app icons, and social images

Use the export dialog to download SVG, PNG, favicon packages, social presets, and Studio app icon zips - with live preview and optional selection export.

Follow on to get updates and support

Logo Lattice groups every download format in one export dialog. Open it from the function bar (download icon), preview your artwork on the left, pick a format tab on the right, then download. Save your .logolattice project separately with the Save button next to Export.

Export scope and preview

  1. Draw at least one shape, then click Export in the function bar.
  2. If shapes are selected, choose Selection to export only those shapes, or Whole canvas for everything on the artboard.
  3. The preview updates as you change tabs and settings. Hover social sizes to see how each aspect ratio frames your logo.

SVG (vector)

  1. Open the SVG tab in the export dialog.
  2. SVG always exports with a transparent artboard - there are no background, padding, or corner radius options.
  3. Click Download SVG at the bottom of the dialog. Use this for print, Figma, Illustrator, or the web when you need infinitely scalable paths.

PNG (raster)

The PNG tab rasterizes your logo into a square image. Free accounts download at 200×200 px; Logo Lattice Studio exports at 1000×1000 px for sharper web and print use.

  1. Open the PNG tab.
  2. Under Background, pick Transparent, White, Black, or Brand fill. Brand fill uses your active fill colour from the Style panel.
  3. Adjust Padding (0-32%) to inset the artwork from the edge, and Corner radius (0-50%) to round the export frame. On a square export, 50% corner radius produces a circle.
  4. Click Download PNG at the bottom of the dialog.

Favicon and web package

  1. Stay on the PNG tab and configure background, padding, and corner radius - the favicon zip uses the same settings.
  2. Click Download favicon & web.zip.
  3. Unzip to get favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png, android-chrome-192x192.png, android-chrome-512x512.png, and site.webmanifest. Drop the PNGs into your site root and link them from your HTML, or adapt the manifest paths to match your project.

Social images

  1. Open the Social tab.
  2. Set Background, Padding, and Corner radius - the same controls as PNG. Brand fill uses your current Style panel swatch.
  3. Hover a preset to update the preview: Open Graph (1200×630), Twitter / X (1200×675), Instagram square (1080×1080), or LinkedIn (1200×627).
  4. Click a row to download that size as a PNG file (for example social-open-graph.png).

App icons (Studio)

App icon export is a Logo Lattice Studio perk. It builds a zip with iOS, Android, and Play Store assets from one download. Free users see an upgrade prompt on the App icons tab.

  1. Open the App icons tab (Studio subscribers only).
  2. Pick an icon background: White, Black, Brand (your fill swatch), or a gradient preset. Studio includes subtle and bold gradients plus a custom two-colour blend.
  3. Set Logo padding and Corner radius - the preview shows how the mark sits inside the square tile.
  4. Click Download app-icons.zip.

What is inside app-icons.zip

  • ios/AppIcon.appiconset/ - PNGs from 40px through 1024px plus Contents.json for Xcode.
  • android/mipmap-mdpi through xxxhdpi/ic_launcher.png - standard launcher densities.
  • android/play-store-icon.png - 512×512 for Google Play listing graphics.

Save and reopen projects

Use Save project (floppy disk icon) in the function bar to download a ".logolattice" file. Open it later from Import → Open .logolattice in the function bar. Project files store shapes, grid settings, styles, and viewport - not exported PNGs or zips.