---
schema_version: "1"
id: 7de7520c8d12b5769d5e2ffe95947d33520f60c8b39e9e4b56f964e942e9830d
title: Configure Components for Flow Screens
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/platform/aura-platform/guides/aura/components/components-config-for-flow-screens.md
canonical_url: https://developer.salesforce.com/docs/platform/aura-platform/guide/components-config-for-flow-screens.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: f91ab4f213e95e68cdd23e73a573be6fa264194f8a1fe588b8f7f116e0983a96
products:
  - Lightning Aura Components Developer Guide
  - Platform Developer Content
---

# Configure Components for Flow Screens

Make your custom Aura components available to flow screens in Flow Builder by implementing the `lightning:availableForFlowScreens` interface.

Here’s the sample code for a simple “Hello World” component.

<!-- otherprops: set_clipboard -->
```nolang
<aura:component implements="lightning:availableForFlowScreens" access="global">
    <aura:attribute name="greeting" type="String" access="global" />
    <aura:attribute name="subject" type="String" access="global" />

    <div style="box">
      <span class="greeting">{!v.greeting}</span>, {!v.subject}!
    </div>
</aura:component>
```

**note:** Mark your resources, such as a component, with `access="global"` to make the resource usable outside of your own org. For example, you want a component to be usable in an installed package or by a Lightning App Builder user or an Experience Builder user in another org.

To make an attribute’s value customizable in Flow Builder, add it to the component's design resource. That way, flow admins can pass values between that attribute and the flow when they configure the screen component.

With this sample design resource, flow admins can customize the values for the “Hello World” component’s attributes.

```nolang
<design:component label="Hello World">
   <design:attribute name="greeting" label="Greeting" />
   <design:attribute name="subject" label="Subject" />
</design:component>
```

A design resource describes the design-time behavior of a Lightning component—information that visual tools require to allow adding the component to a page or app. Adding this resource is similar to adding it for the Lightning App Builder.

When admins reference this component in a flow, they can set each attribute using values from the flow. And they can store each attribute’s output value in a flow variable.

**See Also**  


-   [Control Flow Navigation from an Aura Component](https://developer.salesforce.com/docs/platform/aura-platform/guide/components-config-for-flow-screens-navigate.md)

-   [*Component Library*: lightning:availableForFlowScreens Interface](https://developer.salesforce.com/docs/component-library/bundle/lightning:availableForFlowScreens/documentation)

-   [*Security for Lightning Components:* Lightning Locker](https://developer.salesforce.com/docs/platform/lightning-components-security/guide/locker_intro.html)

