Embed Power Apps in SharePoint Modern Pages

Accessing Power Apps from SharePoint pages is easily achieved using the Embed Web Part.

Get Power App ID

To embed a Power App in a SharePoint page first we need to grab the Power App ID. In your list of Power Apps click on the context menu and select Details. You can also get to this menu from inside your Power App by going to File then Share this App.

Copy the App ID in to a text editor for later use.

 

 

Embed Web Part in SharePoint

 

Enter code into Web Part Properties

  1. Enter the following code into the web part properties box on the right. Copy and paste the PowerApp ID at the end of the PowerApp URL where it says [AppID]
  2. Enter the width and height to match the aspect ratio of your PowerApp
  3. Enter an rbga value for the screen color. This is the color of the PowerApp load screen
  4. Publish your page and you're good to go.
<iframe width="1366px" height="768px" src="https://web.powerapps.com/webplayer/iframeapp?source=iframe&screenColor=rgba(0,144,198,1)&appId=/providers/Microsoft.PowerApps/apps/[AppID]" />