AdobeDocs/uxp-photoshop-plugin-samples

Summary

The AdobeDocs/uxp-photoshop-plugin-samples repository collects 19 sample Photoshop plugins that demonstrate how to build extensions on Adobe's Unified Extensibility Platform (UXP). It is reference material rather than a single library, with each sample illustrating a particular API, framework, or integration pattern for Photoshop 22.0.0 and higher.

What it is useful for

Engineers learning the UXP plugin model can use these samples as concrete starting points for common plugin tasks. The table in the README groups the samples by the APIs they exercise, which makes it easier to pick a starting point for a specific problem.

A few examples from the sample list:

• hello-world-js-sample and hello-world-panel-js-sample show the minimum entrypoints and panel setup in vanilla JavaScript.
• ui-react-starter, ui-vue-starter, and ui-svelte-starter demonstrate wiring each of those UI frameworks into a UXP panel.
• typescript-webpack-sample covers TypeScript with Webpack and uses the @types/photoshop definitions. Note that this sample requires Photoshop 23.0.0, while the rest require 22.0.0 and UXP 4.1.
• web-service-call-js-sample and oauth-workflow-sample show fetching data from a web API and implementing an OAuth flow with a local Express server.
• desktop-helper-sample uses Electron and socket.io to communicate with a UXP plugin from a separate helper app, and cross-compatible-js-sample targets both Photoshop and XD.
• wasm-rust-sample shows using Rust compiled to WebAssembly via wasm-bindgen.
• ui-kitchen-sink includes every available UI component, and plugin-info-vue-full-app is a more complete plugin with multiple entrypoints, File I/O, and Local Storage.

How engineers can use it

The documented setup is straightforward:

1. Clone the repository locally.
2. Open the UXP Developer Tool and use the "Add Plugin..." button to add each plugin, selecting the manifest.json file from the sample's root, plugin, or dist folder.
3. Load the plugin into Photoshop through the ••• menu's Load option.

Each sample has its own README with details specific to that project, so the repository-level instructions are intentionally minimal. The README does not document framework-specific install steps, version numbers beyond the minimums in the table, or test commands, and engineers should check each sample's own folder for any extra dependencies or framework-specific configuration.