Display Images in Salesforce Screen Flows: Static Resources + Flow Builder (Step-by-Step)

Quick, practical guide: add images to your Salesforce Screen Flows using Static Resources and the Display Image component to boost clarity and end-user engagement.

Images in Screen Flows help make processes more intuitive — from showing product photos, icons, or company branding to illustrating steps in guided processes. This short guide explains how to upload an image as a Static Resource and display it on a Salesforce Screen Flow using the built-in Display Image component. It covers best practices, accessibility, and alternative approaches so admins and developers can choose the right option for their org.

Why this matters:

Visuals increase adoption and reduce user errors. When deployed correctly, images improve user trust (logos), context (product images), and instructional clarity (icons or diagrams) — all without custom code.

• Step 1 — Upload the image as a Static Resource
  • Go to Setup → Static Resources → New.
  • Upload your image file, give it a meaningful name (e.g., product_image), and set Cache Control to Public.
  • If you need multiple images, compress them into a ZIP and upload — reference files inside the ZIP like /resourceName/image.png in some contexts.
• Step 2 — Add the image to a Screen Flow
  • Go to Setup → Flows → New Flow → Screen Flow.
  • Add a Screen element, then drag the Display Image component onto the canvas.
  • In the Image Name field, enter the Static Resource name you created (exact match).
  • Adjust sizing and Horizontal Alignment (center is often best for branding and product visuals).
  • Use the Image Alt Text field where available to improve accessibility and screen-reader support.
• Step 3 — Test, activate, and deploy
  • Preview the flow inside the Flow Builder to confirm the image displays correctly in different screen sizes.
  • Activate the flow when ready and add it to Lightning pages, utility bar, or a quick action depending on your use case.

Best practices and tips:

• Keep images optimized (small file sizes, web-friendly formats like PNG or JPG) to reduce load time.
• Use consistent sizing and alignment so flows look professional across screens.
• Prefer Static Resources for stable, org-managed assets. For frequently updated images, consider using Files (ContentDocument) with public URLs or a CDN and reference the public link from the flow (requires additional configuration).
• Always provide meaningful alt text for accessibility and compliance.

Use cases:

• Product selection flows showing product images.
• Onboarding flows with company logos and step illustrations.
• Support or guided troubleshooting flows that use icons or diagrams to clarify instructions.

Why this matters for admins, developers, and business users:

Admins can implement this without Apex or custom LWC, improving speed-to-delivery. Developers will appreciate the simplicity for quick prototypes and can extend the approach for dynamic images when integrating with Files or external storage. Business users benefit from clearer, more engaging guided flows that reduce training time and errors.

#Salesforce #Flow #ScreenFlow #StaticResources #AdminTips

For more, please follow our page!