FAIR

Federated and Independent Repositories

tomatoSHIFT Image Uploader for Figma

Plugin Banner

tomatoSHIFT Image Uploader for Figma

by tomatoSHIFT

Download
Description

Send images from Figma straight to WordPress. tomatoSHIFT Image Uploader for Figma is the WordPress half of a two-part tool: select layers in the Figma plugin, hit upload, and the images land in your Media Library. No exporting to your Downloads folder, no drag and drop, no renaming files.

The plugin adds a REST endpoint protected by an API key you generate in WordPress. Nothing else is exposed, and the plugin makes no outbound requests of its own.

Key features:

  • Figma to WordPress in one click — no manual export, download or upload step
  • Bulk upload — send a whole batch of selected layers at once
  • PNG, JPG and WebP — the Figma plugin resizes, compresses and converts before sending, so what reaches your Media Library is already web-ready
  • Alt text and titles carried over — set them in Figma, keep them on the attachment
  • Secure API key authentication with constant-time comparison
  • No third-party service — images go from Figma to your own site

Typical uses: shipping design assets to a blog post, keeping a landing page in sync with the Figma file, or handing a client site a batch of optimized WebP images without leaving the design tool.

Figma is a trademark of Figma, Inc. This plugin is developed by tomatoSHIFT and is not affiliated with, sponsored by or endorsed by Figma, Inc.

Figma is a trademark of Figma, Inc. This plugin is developed by tomatoSHIFT and is not affiliated with, sponsored by or endorsed by Figma, Inc.

  1. Upload the plugin folder to the /wp-content/plugins/ directory, or install the ZIP via Plugins > Add New.
  2. Activate the plugin through the Plugins menu in WordPress.
  3. Go to Settings > tomatoSHIFT Image Uploader for Figma and click Generate API Key.
  4. Paste the API key into the Figma plugin settings under WordPress API Key.
  1. Choose scale, format (PNG, JPG or WebP), max size and quality in Figma, and see the resulting file size before uploading.

    Choose scale, format (PNG, JPG or WebP), max size and quality in Figma, and see the resulting file size before uploading.

  2. Settings > tomatoSHIFT Image Uploader for Figma: generate the API key and copy it into the Figma plugin.

    Settings > tomatoSHIFT Image Uploader for Figma: generate the API key and copy it into the Figma plugin.

  3. Paste your WordPress site URL and API key into the Figma plugin to connect.

    Paste your WordPress site URL and API key into the Figma plugin to connect.

  4. Select layers on the Figma canvas and upload them in one batch.

    Select layers on the Figma canvas and upload them in one batch.

  5. The uploaded images land straight in the WordPress Media Library.

    The uploaded images land straight in the WordPress Media Library.

  6. Title and alt text set in Figma are carried over to the attachment.

    Title and alt text set in Figma are carried over to the attachment.

Can I upload images from Figma as WebP?

Yes. Pick WebP in the Figma plugin and the image is converted before it is sent; WordPress receives a finished .webp file. JPG and PNG work the same way. Allowed types are filterable via fig2wp_allowed_mimes.

Can I upload several Figma layers at once?

Yes. Select any number of layers on the canvas and they upload as one batch.

Do I need to export from Figma first?

No. That is the point of the plugin — there is no download, no Finder detour and no drag and drop into the Media Library.

How do I get the API key?

Go to Settings > tomatoSHIFT Image Uploader for Figma and click Generate API Key. Copy it into the Figma plugin.

What endpoint does the plugin expose?

POST /wp-json/tomatoshift/v1/upload-images, or ?tomatoshift_upload=1 on the site root for hosts whose anti-bot layer blocks /wp-json/ paths.

Is any external service used?

No. The plugin makes no outbound requests; it only accepts uploads sent to your own WordPress site.

Which origins may call the upload endpoint from a browser?

Only the Figma plugin. Cross-origin requests from anywhere else receive no CORS header and are blocked by the browser. The list is filterable via fig2wp_allowed_origins.

1.2.1

  • Tested against WordPress 7.1. No code changes.

1.2.0

  • Renamed the plugin to “tomatoSHIFT Image Uploader for Figma”. Settings moved to Settings > tomatoSHIFT Image Uploader for Figma.
  • The upload endpoint is now /wp-json/tomatoshift/v1/upload-images and ?tomatoshift_upload=1. The Figma plugin updates itself to match, so no reconnection is needed.
  • Removed an unnecessary include of wp-admin/includes/media.php; the remaining core includes now sit immediately before the function they load.

1.1.2

  • Admin styles and scripts are now enqueued from separate files instead of being printed inline.
  • All user-facing strings are now translatable.
  • The upload endpoint no longer reflects arbitrary CORS origins — only the Figma plugin is allowed, filterable via fig2wp_allowed_origins.
  • Removed an unused settings registration.

1.1.1

  • Fixed a false “the older Fig2WP Image Uploader plugin is still active” error that could appear after the old plugin had already been removed. The 1.1.0 duplicate-class guard is gone; the class is simply named differently now, so the two versions can no longer collide.

1.1.0

  • Renamed the plugin to “Image Uploader for Figma” to meet WordPress.org naming rules. Settings moved to Settings > Image Uploader for Figma.
  • Upgrading from 1.0.x: the plugin folder changed, so this installs alongside the old “Fig2WP Image Uploader” instead of replacing it. Deactivate and delete the old plugin first. Your API key, uploaded media and Figma plugin connection are unaffected.

1.0.1

  • Improved upload reliability on hosts with anti-bot protection (e.g. SiteGround).

1.0.0

  • Initial release.
Back to top