How to export a logo from Figma for a client

1. Prepare a delivery copy of the approved artwork

Create a clearly named delivery area in your Figma file. Put each approved logo variation in its own frame or group: for example, Primary, Symbol and White. Keep rejected concepts and exploratory versions elsewhere. This makes selecting the right export much less error-prone.

Inspect the boundary around each logo. A wide empty frame can leave a tiny mark inside a large image; a tight boundary can clip something that sits outside it. Decide whether padding belongs in the exported asset or will be added by the layout using it. Check the selection against that decision.

Keep the editable original intact. A delivery copy lets you resolve export issues without losing the working text, component structure or other information you may need for a later revision.

• Give each selected export a useful name before downloading it.
• Remove presentation backgrounds from versions intended to be transparent.
• Check that the selected logo includes every part of the approved lockup.
• Confirm that small text, masks and effects survive the intended output.

2. Export an SVG and open it again

With the logo selected, click + beside Export in the properties panel, choose SVG, then export the selection. Figma also supports native PNG, JPG and PDF output; using another tool is optional. Its export controls include custom raster widths and heights.

Figma outlines SVG text by default. That preserves the letter shapes without leaving editable text in the export. Keep the working file for future text edits. Review the export settings if your project specifically requires live text.

Open the downloaded SVG in a browser and, when useful, another vector editor. Compare the wordmark letter by letter with the approved version. Check stroke weights, holes in shapes, the outer bounds and any layered details. A successful download only confirms that a file was created.

Further reading: Figma: export from Figma · Figma: formats and export settings

3. Make screen files for real destinations

Ask the client for the next few places the logo will appear. A website header, presentation and profile image have different constraints. Write down the required dimensions, background and accepted formats before creating a large set of exports.

For example, suppose a developer asks for a transparent raster logo displayed at 180 pixels wide. A 360-pixel-wide export gives that placement a 2× image; a 540-pixel-wide export gives it 3×. Those sizes are specific to this example. Confirm the actual requirement with the developer rather than treating either value as a universal standard. To make the 360-pixel version in Figma, add a PNG export and enter 360w in its Scale field; use 540w for the 3× example.

Use SVG where the destination accepts it and PNG when transparency is needed in a raster file. Provide a JPG only when a solid-background image is appropriate or required. Pick the expected digital color profile; Figma offers sRGB and Display P3 export controls. Test the resulting asset in its real destination.

Acme_Primary_Web.svg
Acme_Primary_Transparent_360px.png
Acme_White_Transparent_360px.png
Acme_Primary_WhiteBackground_1200px.jpg

These are example deliverables, not mandatory sizes.

Continue with: Choose formats by use case

4. Treat print as a separate production decision

If a printer asks for CMYK EPS or a particular PDF specification, record that exact request. A Figma PDF download alone does not establish that the printer’s color, profile and production requirements have been met.

Ask whether the supplier expects process CMYK, spot colors, a named output profile or a particular PDF standard. Check the actual exported file in a suitable inspection workflow and request a proof when color accuracy matters. Supply the logo as an asset; add bleed or trim settings only when you are also preparing the finished layout that requires them.

For supported solid-vector SVG artwork, logopack.app can create CMYK EPS and, with Pro, CMYK PDF logo files using the project’s CMYK values. Complex artwork may need preparation in a vector editor. These exports still need checking against the supplier’s brief.

Further reading: Adobe: PDF output options

5. Choose how to assemble the package

For a small delivery, native Figma exports plus carefully named folders may be enough. Keep the process you can verify easily. If you regularly need many approved variants and file types, a packaging workflow can reduce the manual organization.

One option is to upload the checked SVG to logopack.app, identify the primary logo and any additional versions, review the color variants, and inspect the folder preview. Standard exports include SVG, PNG, JPG, WebP and CMYK EPS. Pro adds custom export settings, CMYK PDF logo output for supported artwork and a PDF Logo Guide.

If you prefer to stay in Figma, TinyImage has a documented Logo Packager workflow. Compare the required outputs and current plan terms before choosing. The useful question is whether the final package matches your client’s needs and saves work you would otherwise do manually.

Continue with: Compare logo packaging workflows

Further reading: TinyImage: prepare a logo package in Figma

6. Check what the client will receive

Unzip the actual delivery in a fresh folder. Open representative files from every format and logo variation. Test a white transparent logo over a dark background so it does not get mistaken for an empty file.

Include short instructions that identify the default logo and explain which files belong in common applications. If editable Figma access is part of the agreement, deliver that separately with the appropriate permissions. A folder of exports does not replace an agreed source-file handoff.

• ✓Compare lettering and shapes with the approved artwork.
• ✓Check raster pixel dimensions, padding and sharpness at use size.
• ✓Inspect transparent assets on both light and dark backgrounds.
• ✓Confirm print color and output settings with the supplier’s request.
• ✓Remove duplicate, rejected and obsolete versions.
• ✓Read the filenames and instructions as someone new to the project.

Common Figma logo export questions