Skip to content
  • There are no suggestions because the search field is empty.

Use cases & best practices

Guide to common use cases and best-practice tips for using the Before and After web part

What can I use the Before and After web part for? 

The Before and After web part is ideal for visually comparing two states of the same image. It helps people quickly understand changes, improvements, or progress without needing long explanations. You might use it to:

  • Show how something has changed or improved over time, like a renovation or redesign.
  • Highlight progress on a project or piece of work as it develops.
  • Add clear visual comparisons to case studies, marketing pages, or training materials.

Any time you want users to clearly see the difference between “before” and “after,” this web part makes it simple and engaging.

Where can I see examples?

Take a look at the Accelerator 365 Look Book - it’s an online gallery full of example pages and templates that show how the Before and After web part can be used in real SharePoint scenarios. You can browse different layouts, see configuration ideas, and even copy the designs to help you get started faster. It’s a great way to get inspiration and jump-start your own setup.

➡️ Learn more here