Adobe PortfolioIntegrating with Adobe Portfolio

Adobe Portfolio lets you build a portfolio site without writing code. You can add interactive 3D to any page by embedding a Needle scene through Portfolio's Embed module — no build step, no hosting to set up.

The fastest path is Needle Cloud: drop your 3D file onto the website, and it's optimized, hosted, and ready to embed in seconds.

1. Upload your model to Needle Cloud

  1. Go to cloud.needle.tools and drag your 3D file onto the page (or click to select it).
  2. Needle Cloud automatically compresses it (Draco + KTX2) and adds Progressive Loading — so the model loads fast, even on mobile, saving ~90% bandwidth and memory compared to the raw file.

You don't need a Unity or Blender project for this — just the exported model file.

Supported file formats

Needle Cloud accepts glTF / GLB, USD / USDZ, FBX, VRM, and OBJ. glTF and USD are used natively; FBX, OBJ, and other formats are converted to glTF for optimization. We recommend exporting to glTF or USD when you can. See Supported 3D Formats.

2. Customize the 3D view — no code required

Open your uploaded asset in Needle Cloud and use the viewer settings to make it look right on your page — all without touching code:

  • Pick a FastHDR skybox from 27+ built-in environments (or upload your own .hdr/.exr), and set environment/background intensity, blur, and rotation.
  • Toggle Ground Projection, adjust lighting, framing, and the camera.
  • Set a transparent or custom background.

Your changes are saved with the asset and carry over to the embed automatically.

3. Copy the embed code from Needle Cloud

  1. Open your asset's Edit page on Needle Cloud.
  2. Click Embed and copy the ready-made iframe code. It looks like this:
<iframe src="https://cloud.needle.tools/view/embed?file=YOUR-ASSET-ID"
    style="width: 100%; height: 500px; border: none;"
    allow="xr; xr-spatial-tracking; fullscreen">
</iframe>

You can embed a specific version or a moving label like latest, so the page updates automatically when you upload a new version — no need to touch Portfolio again.

4. Paste it into Adobe Portfolio

  1. Edit the Portfolio page or project where you want the 3D content.
  2. Add an Embed module (the + / add-content button → Embed).
  3. Paste the iframe code from step 3 and apply it.

Your interactive 3D scene now appears on the page — visitors can orbit, zoom, and (where supported) view it in AR.

Adobe Portfolio only accepts iframe embeds — and may restrict the source

Portfolio's Embed module accepts <iframe> code only, and has historically allowed iframes from a limited set of providers (YouTube, Vimeo, Adobe Express, …). If it rejects the Needle embed with an "invalid embed code" error, use the fallback below.

If the Embed module won't accept the iframe, you can still share the scene by linking to the Needle Cloud viewer instead of embedding it inline. On the asset's Share menu, copy the viewer URL:

https://cloud.needle.tools/view?file=YOUR-ASSET-ID

Add it in Portfolio as a button or a linked thumbnail (use a screenshot of your model as the image). Clicking it opens the interactive 3D scene full-screen in a new tab.

Embedding a full Needle Engine app

The steps above embed a 3D asset via the Needle Cloud viewer. If you've built a full interactive app (a Unity/Blender or code project deployed to Needle Cloud), embed its *.needle.run deployment URL the same way — click Share on the deployment to copy its iframe code. Note that cross-site embedding of *.needle.run deployments requires an EDU/Pro/Enterprise license; see X-Frame-Options.

There are more integration options

See Embedding a Needle project into an existing website for more options and details.