# App components

- [Bravo Tags Master List](/bravo-tags/bravo-tags-master-list.md): Copy and paste these tags into the layer names in your design file and see your app come to life with Bravo Vision.
- [Menus](/bravo-tags/menus.md)
- [Modal Menu](/bravo-tags/menus/modal-menu.md): The menu that slides in from the bottom and covers the entire screen.
- [Modal pages](/bravo-tags/menus/modal-pages.md): Pages that slides in from the bottom and covers the screen.
- [Tabs Menu](/bravo-tags/menus/tabs-menu.md): The menu that stays fixed on every screen as a bottom navigation bar.
- [Pop Up pages](/bravo-tags/menus/tabs-menu-1.md): Pop-up pages can be effective for drawing attention to specific information or encouraging user interaction.
- [Slide Menu](/bravo-tags/menus/slide-menu.md): The menu that opens by sliding in from the left side of the screen.
- [Pages](/bravo-tags/pages.md)
- [Modal pages](/bravo-tags/pages/modal-pages.md): Pages that slides in from the bottom and covers the screen.
- [Pop-up pages](/bravo-tags/pages/pop-up-pages.md): Pop-up pages can be effective for drawing attention to specific information or encouraging user interaction.
- [Swipe page](/bravo-tags/pages/swipe-page.md): Add a component with a vertical swipe effect
- [Transitions page](/bravo-tags/pages/transitions-page.md): Transitions are used to create a smooth and visually appealing flow between different views or states of an app, enhancing the overall user experience.
- [Page reveal animations](/bravo-tags/pages/page-reveal-animations.md): Refers to an animated effect where content or elements gradually become visible on the screen, often in response to a user interaction.
- [Page tabs](/bravo-tags/pages/page-tabs.md): Add a screen with tabs displaying different content
- [Stateful pages](/bravo-tags/pages/stateful-pages.md)
- [Containers](/bravo-tags/containers.md)
- [Swipe to delete](/bravo-tags/containers/swipe-to-delete.md): Enable a native swipe-to-delete functionality in your app
- [Top bar](/bravo-tags/containers/container-top-bar.md): The top bar container fixes its position to the top of the screen and does not scroll with the rest of the screen.
- [Carousel slider](/bravo-tags/containers/container-horizontal-slider.md): Slides a collection of containers horizontally.
- [Aspect ratio relative to screen](/bravo-tags/containers/aspect-ratio-relative-to-screen.md): The height of the container is calculated with the screen height.
- [Sortable List](/bravo-tags/containers/sortable-list.md): Creates a sortable list with API data
- [Layer (sticky element)](/bravo-tags/containers/layer-sticky-element.md): A container that fixes its position on-screen and does not scroll with the rest of the screen.
- [Intro & Onboarding](/bravo-tags/intro-and-onboarding.md)
- [Intro page](/bravo-tags/intro-and-onboarding/page-intro.md): Displays an Intro screen of your choice.
- [Post-login page (Onboarding)](/bravo-tags/intro-and-onboarding/post-login-page-onboarding.md): Add a page that will be displayed after a user logs in or registers
- [Loading experience](/bravo-tags/loading-experience.md)
- [Loading page](/bravo-tags/loading-experience/state-custom-loading-page.md): The app page will display in place of the default Bravo loading screen.
- [Custom loading page](/bravo-tags/loading-experience/custom-loading-page.md): Show a special loading page for a specific page.
- [No loading](/bravo-tags/loading-experience/no-loading.md): Avoid showing the loader on specific user actions
- [Preload](/bravo-tags/loading-experience/preload.md): Optimising asset loading feature
- [Form & input fields](/bravo-tags/form-and-input-fields.md): Create native forms with different input formats
- [Password Visibility Toggle](/bravo-tags/form-and-input-fields/password-visibility-toggle.md): The Password Visibility Toggle is a feature that effortlessly hides/reveals your password on login and signup screens for enhanced security and convenience.
- [Stateful input](/bravo-tags/form-and-input-fields/stateful-input.md): Create a stateful input component in a form
- [Checkboxes (Multiple select)](/bravo-tags/form-and-input-fields/stateful-input/checkboxes-multiple-select.md)
- [Required Checkbox](/bravo-tags/form-and-input-fields/stateful-input/required-checkbox.md)
- [Radio buttons (Single select)](/bravo-tags/form-and-input-fields/stateful-input/radio-buttons-single-select.md)
- [Input time Interval](/bravo-tags/form-and-input-fields/input-time-interval.md): Create the time interval that you want!
- [Dropdown selector](/bravo-tags/form-and-input-fields/dropdown-selector.md): Creates a selector input component.
- [Slider control](/bravo-tags/form-and-input-fields/slider-control.md)
- [Calendar picker](/bravo-tags/form-and-input-fields/calendar-picker.md)
- [Send form input to a database](/bravo-tags/form-and-input-fields/data-biding-send-form-input-to-a-database.md)
- [Components](/bravo-tags/components.md)
- [Autoplay Video](/bravo-tags/components/component-autoplay-video.md): Autoplays an audio-less video when the user is on that app page.
- [GIF](/bravo-tags/components/component-gif.md): A GIF will replace the content of the rectangle.
- [SVG Component](/bravo-tags/components/svg-component.md)
- [Web view](/bravo-tags/components/component-webview.md): A web page will replace the content of the rectangle.
- [Web Components using AI](/bravo-tags/components/web-component-using-ai.md)
- [Web view communication](/bravo-tags/components/web-view-communication.md)
- [LottieFile](/bravo-tags/components/component-lottie.md): A Lottie will replace the content of the rectangle.
- [Lottie-animated component](/bravo-tags/components/lottie-animated-component.md): Create stateful components with Lottie animations
- [Flexible text (Flexo)](/bravo-tags/components/component-flexible-text.md): The text box will expand down to fit the content connected via API.
- [Zoomable image](/bravo-tags/components/zoomable-image.md): Makes an image zoomable with pinch gesture.
- [Component states](/bravo-tags/components/component-states.md): Add states such as pressed and active to your UI elements.
- [Stateful component (like button)](/bravo-tags/components/stateful-component-like-button.md): Create components with default and active states
- [Setting up the backend of Stateful component (like button)](/bravo-tags/components/setting-up-the-backend-of-stateful-component-like-button.md): Managing the stateful components requires the creation of a database that keeps track of the state for each component, and API requests to exchange the information.
- [Haptic Feedback (Buzzz)](/bravo-tags/components/haptic-feedback.md): Make your phone vibrate when adding interaction on your apps, such as navigation links or any action.
- [Progress bar](/bravo-tags/components/progress-bar.md)
- [Rich text](/bravo-tags/components/rich-text.md): Display the same text style as the content you get from an API
- [Date, Time and Currency Formatter](/bravo-tags/components/date-time-and-currency-formatter.md)
- [Scrollable text](/bravo-tags/components/scrollable-text.md)
- [Text Lines & Truncation](/bravo-tags/components/text-lines-and-truncation.md)
- [Status bar](/bravo-tags/components/status-bar.md)
- [Mobile actions](/bravo-tags/mobile-actions.md)
- [Mobile Actions](/bravo-tags/mobile-actions/mobile-actions.md)
- [Play audio](/bravo-tags/mobile-actions/action-play-audio.md): Plays an MP3 track in your app.
- [Record audio](/bravo-tags/mobile-actions/record-audio.md)
- [Play video](/bravo-tags/mobile-actions/how-to-use-video-components-in-your-apps.md)
- [Scan QR code (external URL)](/bravo-tags/mobile-actions/scan-qr-code.md): Open the camera to scan QR codes.
- [Scan codes (remote action)](/bravo-tags/mobile-actions/scan-codes-remote-action.md): Scan a barcode or QR code and send its data via API
- [Search & filter](/bravo-tags/mobile-actions/component-search-and-filter.md): The text box will turn into a search field where users can filter items from a list on the same page by text content.
- [Refresh page](/bravo-tags/mobile-actions/action-pull-to-refresh.md): Refreshes a screen connected to external data.
- [Share location](/bravo-tags/mobile-actions/share-location.md)
- [App Icon & Splash Screen](/bravo-tags/app-icon-and-splash-screen.md): Replace the default Bravo app icon and splash screen with your custom design.
- [Map with markers](/bravo-tags/map-with-markers.md)
- [Charts](/bravo-tags/charts.md): Create a pie or bar chart connected to API data