---
schema_version: "1"
id: 5875cf4aecfc12621077073f091d1273e78a353cf46e2890ba39e9f3772873af
title: Working with Flexcards
collection: admin
version: current
locale: en-us
portal_url: https://docs.salesforce.com/admin/current/en-us/xcloud/264-0-0/flexcard_workflow.md
canonical_url: https://help.salesforce.com/s/articleView?id=xcloud.flexcard_workflow.htm&release=264.0.0&type=5
source_site: help.salesforce.com
content_type: documentation
content_hash: b14170b461cf6a1526880f10356a6196e3b9bc2baec8b48c0fd8841ce48bb485
description: Create and manage Flexcards in the designer in the Omnistudio standard runtime. The designer provides the standard components for building user interfaces within Salesforce. Create Flexcards in fewer steps. With the designer, Flexcards activation is instant.
products:
  - Omnistudio
release: "264"
---
# Working with Flexcards

Create and manage Flexcards in the designer in the Omnistudio standard runtime. The designer provides the standard components for building user interfaces within Salesforce. Create Flexcards in fewer steps. With the designer, Flexcards activation is instant.

![Flexcard workflow](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-xcloud-omnistudio-264-0-0-production-enus/f526eaa8-ae05-487a-8944-4bb99b0b78ac/omnistudio/images/Flexcard_Flowchart.png)

1. Create a Flexcard with a unique combination of name and author.
    
    See [Create a Flexcard](https://help.salesforce.com/s/articleView?id=xcloud.os_create_a_flexcard_25432.htm&release=264.0.0&type=5 "Create a Flexcard by specifying a unique name and author. Optionally, save the Flexcard as a child card to embed it in other Flexcards. In the designer for a managed package, you can also configure its data sources and test parameters.").
2. Configure the behavior, visual elements, and interactions that the Flexcard offers to your users. For example, configure settings, add fields for input data, navigation elements to open links, specify the elements’ responsiveness, and more. If needed, modify the style elements such as background and size to provide a customized experience to your users.
    
    See [Configure Flexcard Settings](https://help.salesforce.com/s/articleView?id=xcloud.os_set_up_a_flexcard_in_the_flexcard_designer_37646.htm&release=264.0.0&type=5 "Specify your Flexcard’s behavior with the setup options. For example, add or update a data source, create an event listener, or add session variables."), [Add Elements to a Flexcard](https://help.salesforce.com/s/articleView?id=xcloud.os_add_elements_to_a_flexcard_25561.htm&release=264.0.0&type=5 "Build your card by dragging elements into a state on the canvas. Add data fields, display, and input elements to your Flexcard. Show data generated dynamically from the Flexcard’s data source, or add static information. Rearrange, clone, delete, and adjust the widths of your elements as needed. Style an element and configure its properties in the Flexcard designer."), [Set Up Actions on a Flexcard](https://help.salesforce.com/s/articleView?id=xcloud.os_add_an_action_to_a_flexcard_25672.htm&release=264.0.0&type=5 "Configure actions that users can complete on Flexcards to improve the self-service experience, and save time on manual tasks. Add actions to supported elements or add an action element to a Flexcard, and then configure the action settings. For example, you want to have a button that opens a URL for additional information. To do so, add an action to an existing image or add an action element for which you select an image. You can also set up sequential actions and configure each action’s trigger."), [Set Up Conditions to a Flexcard Element](https://help.salesforce.com/s/articleView?id=xcloud.os_add_conditions_to_a_flexcard_element_35370.htm&release=264.0.0&type=5 "Apply conditions to Flexcards elements to show only relevant information to your users based on data field values. For example, on a Flexcard that summarizes the terms of a contract, only show reminder text when the contract renewal date is within a defined range."), and [Style a Flexcard](https://help.salesforce.com/s/articleView?id=xcloud.os_style_flexcard_elements_38751.htm&release=264.0.0&type=5 "Configure the look and feel of a Flexcard by styling individual elements, fields inside elements, and entire states. Configure backgrounds, text, and borders; adjust dimensions and element spacing; apply classes and inline styles; make your element responsive; and more.").
3. Preview the Flexcard, test its look and feel, and resolve issues as needed.
    
    See [Preview and Debug a Flexcard](https://help.salesforce.com/s/articleView?id=xcloud.os_preview_a_flexcard_41051.htm&release=264.0.0&type=5 "Preview a Flexcard's appearance and test its functionality before you publish it to a Lightning page or to a page in an Experience Builder Aura site. Review how the Flexcard looks on multiple devices and test the functionality of interactive elements such as actions. Debug the Flexcard's data output, events, actions, and more.").
4. After you confirm that the Flexcard is ready, activate it. Then, add the Flexcard as a standard component to a target page, such as an app page or community page.
    
    See [Activate and Publish a Flexcard](https://help.salesforce.com/s/articleView?id=xcloud.os_activateconfigureand_publish_flexcards_24744.htm&release=264.0.0&type=5 "After you confirm that the Flexcard is ready, activate it. After activation, add the Flexcard to a Lightning page or to a page in an Experience Builder site.").