Need to organize your content into adaptive cards like these?
No design skills needed to make your page look this good!
Setting up the web part
Edit the page where you want to see the Tabs, and pick this app from the gallery:
Adding a new tabs and cards
-
Edit web part properties and click the Add/Remove Tabs button
-
Add, remove, or re-order tabs as you see fit
To associate cards to your tab:
-
Click the Add/Remove Cards button in web part properties
-
Pick the name for the card, the associated tab, any details, links, images, and the color for the card border:
-
Save the page
Changing web part styles
Here are the styling options you can change to your liking:
-
Color of Tab Heading will change the text color for the tab and card heading.
-
Card Width will set how many cards can you fit within a tab. The wider the card the less items it fits:
-
Show Tabs will let you hide tabs if you only have one:
Tab Targeting: Show Tabs to Specific Microsoft 365 Groups
Available in Tabs with Cards – Version April 14, 2025
You can now display specific tabs only to members of selected Microsoft 365 Groups. This allows for more personalized and secure content visibility on your SharePoint pages.
Before You Begin
Please ask your Microsoft 365 administrator to confirm that the proper permissions have been granted.
They can follow this guide:
Grant Origami web parts ability to target content to specific M365 groups
How to Create Microsoft 365 Groups
- M365 Groups can be created manually via the Microsoft 365 Admin Center.
- If you’ve created a Team Site, SharePoint automatically generates M365 Groups for Site Members and Site Owners.
Example:
If you’ve created a Team Site called “HR Site”, you’ll see a group named “HR Site Members”. This group is automatically generated and can be used for link targeting..
Targeting Tabs to a Specific Group
-
Add or edit a Tabs using Tabs with Cards.
-
In the targeting section, search for the M365 Group name (e.g., HR Site Members).
-
Select the group from the list.
Done!
Once you save the page, your selected tabs will only be visible to people in the specified group(s).
Want to Remove Targeting?
Simply clear the group name(s) from the text box. This will make the tab visible to everyone.