Pop Up pages

Pop-up pages can be effective for drawing attention to specific information or encouraging user interaction.

👉 The Tag

By using this new tags you will be available to make new pages to popup!

📍 Where to add the tag: A top-level app page.

🏷️ How to add the tag

1. On a blank app page, create a Pop up design.

2. Use the tag that you prefer the most for your pop-up.

Normal Pop Up

Use this tag:

Normal Popup [page:popup]

Rounded Corners Pop Up

In case you want rounded corners use this tag:

Rounded Corners Popup [page:popup] 

Color Background Pop Up

In case you want a color background Pop up use the follow tag:

Color Background Popup [page:popup:#CCFAFF00]

Blur Background Pop Up

You want a blur background Pop Up:

Blur Background Popup [page:popup:blur] 

Slider Pop Up

This is the case if you need to show more than one pop-up at a time.

Slider popup[page:popup]
Slide [container:slider:horizontal]

🔥 Important: To Close the popup the action close will be required:

[action:close]

Now you can do the prototyping! Your Pop Up is ready to use. Import to Bravo & preview on Bravo Vision 🚀

it's important to use the Pop up pages judiciously to avoid creating a negative user experience, as excessive or intrusive pop ups can be disruptive and may lead to a poor user experience.

💾 Example files

Duplicate the files below to see how to set it up!

https://www.figma.com/community/file/981969825191369221www.figma.com