# Parameters for components

> Parameters define the data that a component definition needs, which might be data in some external system or local parameters to influence how the external data appears when rendered.

Source: https://docs.uniform.app/docs/guides/models/components/parameters

Parameters are the elements that make up the component, such as a title, description, or image. They define the data that a component definition needs, which might be data in some external system or local parameters to influence how the external data appears when rendered.

For example, a promotion component might have two parameters:

- Content, which is a link to some content in a headless CMS
- Alignment, which could be a single select with text alignment options.

These are the basic building block of what will end up as component props when rendering a Canvas composition.

A [parameter](https://docs.uniform.app/docs/guides/composition/glossary#parameter) lets
you set a value on a component. Each parameter has a type. The
parameter type determines the kind of value you can set for the
parameter.

## Add a parameter

1. In your project, navigate to **Experience > Components** and select your component.
2. Click the tab **Parameters**.

   ![Click to add a parameter.](https://docs.uniform.app/images/guides/composition/components/parameters/no-parameters.png)
3. Click the  **Add parameter** button.
4. Select a base type for your parameter:

   ![Select a type of parameter to add to your component.](https://docs.uniform.app/images/guides/composition/components/parameters/add-parameter-base-type.png)
5. Configure common properties (such as **Name**, **Public ID**, **Help text**, and **Guidance**) and parameter-type-specific settings in the **Editor settings** and **Conditions & Localization** tabs. See [parameter types](#parameter-types) below for reference.
6. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
7. After all component updates are complete, make sure to **save the component** to apply your changes.

> **Use an AI coding assistant:**
>
> The [`uniform-experience-modeling`](https://github.com/uniformdev/agent-skills/tree/main/skills/uniform-experience-modeling) agent skill teaches coding assistants such as Claude Code, Codex, Cursor, and Copilot experience modeling best practices: parameters, slots, component granularity, and patterns. Use it to create component definitions, map a design system to Uniform components, or review an existing component library. To install it, see [Uniform agent skills](https://docs.uniform.app/docs/guides/ai/agent-skills).

## Parameter configuration

Parameter configuration is organized in two tabs: **Editor settings** and **Conditions & Localization**.

### Editor settings tab

Validation settings (such as required, min/max, or regex) and, options to change how the control appears in the editor. The settings in this tab are specific to the parameter type.

### Conditions & Localization tab

Define the [Localization](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable) (locale-specific values and default behavior) and [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic#conditional-values) settings for the parameter.

![Parameter configuration showing Conditions & Localization tab with Localizable and Allow conditional values](https://docs.uniform.app/images/guides/models/conditions-localization-tab.png)

## Parameter types

The configuration options for each base parameter type differ. Each parameter type's options are outlined here.

### Asset

The asset parameter connects images and other media that may be stored in Uniform's asset library, a [data resource](https://docs.uniform.app/docs/guides/composition/glossary#data-resource) or an external digital asset management system. It also supports inline linking to URLs of external media files.

To render the data from an asset parameter in front-end applications, learn about the [asset utilities](https://docs.uniform.app/docs/guides/composition/rendering/blocks-assets) provided by the Uniform SDK.

> **Tip:**
>
> View the guide on [media assets](https://docs.uniform.app/docs/guides/composition/manage-assets) for a more lengthy explanation on differences between an asset and an image URL.

1. When adding an **asset** parameter, enter the following values:

   | Name | Description | Notes |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Guidance | Instructions that help [Scout](https://docs.uniform.app/docs/guides/ai/scout) and [AI quick edits](https://docs.uniform.app/docs/guides/ai/ai-quick-edits) understand what content to generate for this parameter. Describe the expected format, length, writing style, or specific requirements. Keep it concise (1-2 sentences). Learn more about [AI guidance](https://docs.uniform.app/docs/guides/ai/ai-guidance). |  |
   | Required | Indicates whether setting an asset is required when the component is used. Default: false. |  |
   | Number of assets | Specify a minimum and maximum number of assets that can be added to the selection. |  |
   | Restrict asset types | Allow only specific types to be uploaded or selected:   <br>Image, Video, Audio, Other<br>![Example: Restrict an asset parameter to video files](https://docs.uniform.app/images/guides/composition/components/parameters/assets-restrict-asset-types.png) |  |
   | Localizable | Allows the parameter to be [localizable](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable).<br>If enabled, the default localization behavior can be set:<br>- Localized: One value can be set per locale<br>- Not localized: Single value is used across all locales<br>Editors can change the localization behavior on a per-instance basis. |  |
   | Allow conditional values | Set up multiple potential values and conditions for use.<br>Learn more about [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic/conditional-values). |  |
   | Use as display name | Setting this value to **true** will show the alt attribute of the first asset as the name of the component within the structure panel of a composition. |  |
   | Use as thumbnail | Setting this value to **true** will show the first asset as the thumbnail of the entry |  |
2. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
3. After all component updates are complete, make sure to **save the component** to apply your changes.

### Blocks

[Blocks](https://docs.uniform.app/docs/guides/models/blocks) are used to model repeated data within a component. They expect an array of data that's only shared in relation to something else. For example, on a site selling coffee beans you wouldn't present roasts or grind levels independent of the context of coffee beans. Learn about [block utilities](https://docs.uniform.app/docs/guides/composition/rendering/blocks-assets) provided by the Uniform SDK.

Blocks differ from [slots](https://docs.uniform.app/docs/guides/models/components#slots) in that they're data or content focused, where slots are for nested or repeated UI components.

[Scout](https://docs.uniform.app/docs/guides/ai/scout) can add block parameters for you and create the block types they allow — see [Scout capabilities and limitations](https://docs.uniform.app/docs/guides/ai/scout/use-cases-and-capabilities#content-modeling).

To add a block parameter to a component:

1. Create or navigate to the component to which you want to add a block at **Experience > Components**.
2. In the **parameters** section click **Add parameter** as described above.
3. Select **Block** from the list of field types.
4. Enter the following values:

   | Name | Description | Notes |  |
   | --- | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |  |
   | Required | Indicates whether setting a block is required when the component is used. Default: false. |  |  |
   | Number of blocks | Minimum: The minimum number of blocks to allow in the field.  <br>Maximum: The maximum number of blocks to allow in the field. |  |  |
   | Search for a type: | A field to select other content types to connect to the block field. | List of content types to connect to the block field. |  |
   | Allowed block types | A search field and available blocks are provided to find the block types you want to add. If you haven't yet created a block, you will see a message stating that there are no blocks created. You can add this field now, but it won't be useful until at least one block type is created and allowed in it. |  |  |

### Boolean

The Boolean parameter stores a true or false value. You can configure how it appears in the editor (e.g. toggle vs segmented control).

![Three boolean parameter configurations: default switch, switch with Yes label, and segmented control with No and Yes.](https://docs.uniform.app/images/guides/models/boolean-param-editors.png)

1. When adding a **Boolean** parameter, enter the following values:

   | Name | Description |  |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Guidance | Instructions that help [Scout](https://docs.uniform.app/docs/guides/ai/scout) and [AI quick edits](https://docs.uniform.app/docs/guides/ai/ai-quick-edits) understand what content to generate for this parameter. Describe the expected format, length, writing style, or specific requirements. Keep it concise (1-2 sentences). Learn more about [AI guidance](https://docs.uniform.app/docs/guides/ai/ai-guidance). |  |
   | False label | Optional. When both **False label** and **True label** are set, the editor shows a segmented control (e.g. "No" \| "Yes") instead of a toggle. Example: "No", "False". |  |
   | True label | Optional. When both labels are set, the editor uses a segmented control. Otherwise, the editor shows a toggle switch and uses this as the label next to it; the false label is ignored. Example: "Yes", "True". |  |
   | Localizable | Allows the parameter to be [localizable](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable).<br>If enabled, the default localization behavior can be set:<br>- Localized: One value can be set per locale<br>- Not localized: Single value is used across all locales<br>Editors can change the localization behavior on a per-instance basis. |  |
   | Allow conditional values | Set up multiple potential values and conditions for use.<br>Learn more about [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic/conditional-values). |  |

   `How Uniform stores the value`

   ```json
   {
      "type": "checkbox",
      "value": true
   }
   ```
2. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
3. After all component updates are complete, make sure to **save the component** to apply your changes.

### Date

The date parameter adds an area where authors can either enter a date (in `mm/dd/yyyy` format) or use a calendar selector to pick a date.

1. When adding a **date** parameter, enter the following values:

   | Name | Description | Notes |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Guidance | Instructions that help [Scout](https://docs.uniform.app/docs/guides/ai/scout) and [AI quick edits](https://docs.uniform.app/docs/guides/ai/ai-quick-edits) understand what content to generate for this parameter. Describe the expected format, length, writing style, or specific requirements. Keep it concise (1-2 sentences). Learn more about [AI guidance](https://docs.uniform.app/docs/guides/ai/ai-guidance). |  |
   | Required | Indicates whether setting a date is required when the component is used. Default: false. |  |
   | No earlier than | Specify a date before which no author can set a value. |  |
   | No later than | Specify a date after which no author can set a value. |  |
   | Localizable | Allows the parameter to be [localizable](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable).<br>If enabled, the default localization behavior can be set:<br>- Localized: One value can be set per locale<br>- Not localized: Single value is used across all locales<br>Editors can change the localization behavior on a per-instance basis. |  |
   | Allow conditional values | Set up multiple potential values and conditions for use.<br>Learn more about [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic/conditional-values). |  |
   | Use as display name | Setting this value to **true** will show what's entered in the **Date** field as the name of the component within the structure panel of a composition. |  |
2. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
3. After all component updates are complete, make sure to **save the component** to apply your changes.

### Date/Time

The date/time parameter allows you to set a date and time in a specific timezone. The date and time are stored in the [ISO 8601 format](https://en.wikipedia.org/wiki/ISO_8601) in UTC. Time zone names correspond to the [tz database](https://en.wikipedia.org/wiki/Tz_database), such as `America/New_York`.

1. When adding a **date/time** parameter, enter the following values:

   | Name | Description |  |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Guidance | Instructions that help [Scout](https://docs.uniform.app/docs/guides/ai/scout) and [AI quick edits](https://docs.uniform.app/docs/guides/ai/ai-quick-edits) understand what content to generate for this parameter. Describe the expected format, length, writing style, or specific requirements. Keep it concise (1-2 sentences). Learn more about [AI guidance](https://docs.uniform.app/docs/guides/ai/ai-guidance). |  |
   | Required | Indicates whether setting a date is required when the component is used. Default: false. |  |
   | Localizable | Allows the parameter to be [localizable](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable).<br>If enabled, the default localization behavior can be set:<br>- Localized: One value can be set per locale<br>- Not localized: Single value is used across all locales<br>Editors can change the localization behavior on a per-instance basis. |  |
   | Allow conditional values | Set up multiple potential values and conditions for use.<br>Learn more about [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic/conditional-values). |  |
   | Use as display name | Setting this value to **true** will show what's entered in the **Date/Time** field as the name of the component within the structure panel of a composition. |  |
2. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
3. After all component updates are complete, make sure to **save the component** to apply your changes.

### Enrichment

The Enrichment parameter allows you to associate an [enrichment](https://docs.uniform.app/docs/guides/classification/enrichments) with a field on a content entry or a component parameter. This differs from the built-in Enrichment Tags on components, which automatically add enrichment values to visitor profiles when content is viewed. Instead, the Enrichment parameter is designed specifically for [programmatic enrichment](https://docs.uniform.app/docs/guides/classification/enrichments#programmatic-enrichment) on components or for connecting the enrichment values of a content entry to a [dynamic composition](https://docs.uniform.app/docs/guides/classification/enrichments#use-enrichments-on-dynamic-compositions).

1. When adding a **Enrichment** parameter, enter the following values:

   | Name | Description |  |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Guidance | Instructions that help [Scout](https://docs.uniform.app/docs/guides/ai/scout) and [AI quick edits](https://docs.uniform.app/docs/guides/ai/ai-quick-edits) understand what content to generate for this parameter. Describe the expected format, length, writing style, or specific requirements. Keep it concise (1-2 sentences). Learn more about [AI guidance](https://docs.uniform.app/docs/guides/ai/ai-guidance). |  |
2. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
3. After all component updates are complete, make sure to **save the component** to apply your changes.

### Single Select

Lets a user select a single value from a list of options that are assigned to the parameter. It's used when you want to limit the options that are available to the user.

![Single select parameter shown as dropdown, radio buttons, segmented controls (text, icon only, with icon), and slider with XS to XXL.](https://docs.uniform.app/images/guides/models/single-select-param-editors.png)

1. When adding a **single select** parameter, enter the following values:

   | Name | Description |  |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Guidance | Instructions that help [Scout](https://docs.uniform.app/docs/guides/ai/scout) and [AI quick edits](https://docs.uniform.app/docs/guides/ai/ai-quick-edits) understand what content to generate for this parameter. Describe the expected format, length, writing style, or specific requirements. Keep it concise (1-2 sentences). Learn more about [AI guidance](https://docs.uniform.app/docs/guides/ai/ai-guidance). |  |
   | Editor | In **Editor settings**, choose how the value is selected: **Select** (default dropdown), **Radio buttons**, **Segmented control** (horizontal buttons; each option can have an optional icon plus **Text** and **Value**), or **Slider** (horizontal slider over the same options, e.g. XS–XXL). |  |
   | Options | The values that populate the control. Click **Add Option** (or **Add Item**) and specify **Text** (label) and **Value** for each option. For **Segmented control**, options can also include an optional **Icon** (use "Select an icon"); leave **Text** empty for icon-only display. |  |
   | Required | Indicates whether setting a link is required when the component is used. Default: false. |  |
   | Localizable | Allows the parameter to be [localizable](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable).<br>If enabled, the default localization behavior can be set:<br>- Localized: One value can be set per locale<br>- Not localized: Single value is used across all locales<br>Editors can change the localization behavior on a per-instance basis. |  |
   | Allow conditional values | Set up multiple potential values and conditions for use.<br>Learn more about [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic/conditional-values). |  |
   | Use as display name | Setting this value to **true** will show what's selected in the **Single select** field as the name of the component within the structure panel of a composition. |  |

   `How Uniform stores the value`

   ```json
   {
      "type": "select",
      "value": "######################"
   }
   ```
2. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
3. After all component updates are complete, make sure to **save the component** to apply your changes.

### Multi Select

Lets a user select multiple values from a list of options that are assigned to the parameter. It's used when you want to limit the options that are available to the user.

![Multi-select dropdown with selected pills and checkboxes list for multiple options.](https://docs.uniform.app/images/guides/models/multi-select-param-editors.png)

1. When adding a **multi select** parameter, enter the following values:

   | Name | Description |  |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Guidance | Instructions that help [Scout](https://docs.uniform.app/docs/guides/ai/scout) and [AI quick edits](https://docs.uniform.app/docs/guides/ai/ai-quick-edits) understand what content to generate for this parameter. Describe the expected format, length, writing style, or specific requirements. Keep it concise (1-2 sentences). Learn more about [AI guidance](https://docs.uniform.app/docs/guides/ai/ai-guidance). |  |
   | Editor | In **Editor settings**, choose **Multi Select** (default dropdown) or **Checkboxes** (each option shown as a checkbox). |  |
   | Options | The values that populate the select field. Click on the **Add Option** button to add a new option and specify the label text and value for it. |  |
   | Number of selections | Minimum: The minimum number of selections to allow in the parameter.  <br>Maximum: The maximum number of selections to allow in the parameter. |  |
   | Localizable | Allows the parameter to be [localizable](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable).<br>If enabled, the default localization behavior can be set:<br>- Localized: One value can be set per locale<br>- Not localized: Single value is used across all locales<br>Editors can change the localization behavior on a per-instance basis. |  |
   | Allow conditional values | Set up multiple potential values and conditions for use.<br>Learn more about [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic/conditional-values). |  |
   | Use as display name | Setting this value to **true** will show what's selected in the **Multi select** field as the name of the component within the structure panel of a composition. |  |

   `How Uniform stores the value`

   ```json
   {
      "type": "multi-select",
      "value": [
         "optionValue1",
         "optionValue2"
      ]
   }
   ```
2. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
3. After all component updates are complete, make sure to **save the component** to apply your changes.

### Image URL

The image URL parameter provides a visual preview for an external image URL.

> **Legacy parameter type:**
>
> This parameter type is recommended only for legacy projects or basic scenarios where you need to reference an external image via URL.
>
> For new projects, we highly recommend using the [asset parameter](https://docs.uniform.app/docs/guides/models/components/parameters#asset) instead which is more versatile and is integrated with the Uniform Asset Library.

1. When adding an **image URL** parameter, enter the following values:

   | Name | Description | Notes |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Required | Indicates whether setting an image URL is required when the component is used. Default: false. |  |
   | Validation Regex (optional) | Validation logic that limits the text the user can enter. | This uses the regular expression features in the user's browser. |
   | Validation Regex Message | Message displayed to the user when the input doesn't match the validation regex. | Only used if the validation regex is specified. |
   | Localizable | Allows the parameter to be [localizable](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable).<br>If enabled, the default localization behavior can be set:<br>- Localized: One value can be set per locale<br>- Not localized: Single value is used across all locales<br>Editors can change the localization behavior on a per-instance basis. |  |
   | Allow conditional values | Set up multiple potential values and conditions for use.<br>Learn more about [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic/conditional-values). |  |
   | Use as display name | Setting this value to **true** will show what's entered in the **Image URL** field as the name of the component within the structure panel of a composition. |  |

   `How Uniform stores the value`

   ```json
   {
      "type": "image",
      "value": "https://my-website.dev/welcome.png"
   }
   ```

   > **Note:**
   >
   > Uniform doesn't optimize the image when rendered in your frontend application. Try to keep the image file size as small as possible.

   The Uniform **image URL parameter** always requires an image URL to function correctly. You can provide this directly from an image hosted in a remote source (such as a DAM, CMS or brand gallery).

   > **Image URL parameter no longer supports uploads:**
   >
   > As of **March 11, 2025**, image uploads via the Image URL parameter are no longer supported.
   >
   > Any previously uploaded images used in Image URL parameters will continue to function normally, but you cannot upload new images through this method.
   >
   > For all image upload needs, please use the [Asset parameter](https://docs.uniform.app/docs/guides/composition/manage-assets/asset-parameter), which provides improved asset management capabilities.
2. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
3. After all component updates are complete, make sure to **save the component** to apply your changes.

### JSON Data

The JSON data parameter lets you store any data that's serialized in valid JSON.

1. When adding a **JSON data** parameter, enter the following values:

   | Name | Description | Notes |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Guidance | Instructions that help [Scout](https://docs.uniform.app/docs/guides/ai/scout) and [AI quick edits](https://docs.uniform.app/docs/guides/ai/ai-quick-edits) understand what content to generate for this parameter. Describe the expected format, length, writing style, or specific requirements. Keep it concise (1-2 sentences). Learn more about [AI guidance](https://docs.uniform.app/docs/guides/ai/ai-guidance). |  |
   | Required | Indicates whether setting a link is required when the component is used. Default: false. |  |
   | Expected JSON schema | By providing a [JSON schema](https://json-schema.org/) you can provide validation rules to specify the expected shape and value types of the parameters JSON data. The JSON schema needs to follow the [Draft 7 specification](https://json-schema.org/specification-links.html#draft-7). |  |
   | Localizable | Allows the parameter to be [localizable](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable).<br>If enabled, the default localization behavior can be set:<br>- Localized: One value can be set per locale<br>- Not localized: Single value is used across all locales<br>Editors can change the localization behavior on a per-instance basis. |  |
   | Allow conditional values | Set up multiple potential values and conditions for use.<br>Learn more about [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic/conditional-values). |  |
   | Use as display name | Setting this value to **true** will extrapolate a value from the JSON data entered as the name of the component within the structure panel of a composition. |  |

   ```json
   {
       "type": "object",
       "required": ["name", "sku"],
       "properties": {
         "name": {
            "type": "string"
         },
         "sku": {
            "type": "string"
         },
         "description": {
            "type": "string"
         },
         "price": {
            "type": "number"
         },
         "currency": {
            "type": "string"
         }
       },
       "description": "A simple product schema"
   }
   ```

   `How Uniform stores the value`

   ```json
   {
      "type": "json",
      "value": {
         /* any JSON data */
      }
   }
   ```
2. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
3. After all component updates are complete, make sure to **save the component** to apply your changes.

### Link

The link parameter lets a user create a link to a:

- Node in a **project map**
- Static **URL**
- **Email address**
- **Telephone number**

If the link is to a project map node, the value will automatically update when the path of the node changes (e.g., if it's moved).

1. When adding a **link** parameter, enter the following values:

   | Name | Description |  |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Guidance | Instructions that help [Scout](https://docs.uniform.app/docs/guides/ai/scout) and [AI quick edits](https://docs.uniform.app/docs/guides/ai/ai-quick-edits) understand what content to generate for this parameter. Describe the expected format, length, writing style, or specific requirements. Keep it concise (1-2 sentences). Learn more about [AI guidance](https://docs.uniform.app/docs/guides/ai/ai-guidance). |  |
   | Types of links | The types of links this parameter supports: **Project map**, **URL**, **Email address**, and **Telephone number**. All are enabled by default. |  |
   | Allow anchors | Lets editors append a URL fragment (for example `#section`) to project map links so the link jumps to a specific element on the linked page. The anchor is stored as part of the link's `path`. For URL links editors can type the fragment directly into the URL; email and telephone links don't support anchors. |  |
   | Allowed custom link attributes | A list of HTML attributes (such as `target`, `rel`, `class`, or `data-*`) that editors can set on links created with this parameter. For each attribute you define a **key** (the literal HTML attribute name), an optional **label** and **help text** shown to the editor, and optional **predefined options**. When options are provided the editor picks from a dropdown; otherwise the editor enters a free-text value.<br>For example, to let editors choose how a link opens, select **Add attribute** and configure the **Edit attribute** dialog:<br>- **Key**: `target` — the literal HTML attribute name.<br>- **Label**: `Link target` — shown to editors instead of the key.<br>- **Help text**: `Defines how the link is opened when clicked`.<br>- Enable **Provide predefined options** and add **New window** with value `_blank` and **Same window** with value `_self`. Editors then pick from a dropdown instead of typing a value. Leave this option unchecked to let editors enter a free-text value instead, which is useful for tracking keys like `data-campaign`.<br>![EConfiguring a target attribute with predefined link target options.](https://docs.uniform.app/images/guides/models/link-param-edit-attribute.png)<br>Once saved, the attribute appears in the parameter's allowed custom link attributes list, where you can edit or remove it.<br>![Allowed custom link attributes list showing the target attribute with the label Link target.](https://docs.uniform.app/images/guides/models/link-param-allowed-attributes.png)<br>> **Dangerous attributes are blocked:**<br>><br>> Dangerous keys (`href`, `src`, `style`, `formaction`, or any `on*` handler such as `onclick`) trigger a warning. You can still save them, but the web SDKs won't render them. |  |
   | Localizable | Allows the parameter to be [localizable](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable).<br>If enabled, the default localization behavior can be set:<br>- Localized: One value can be set per locale<br>- Not localized: Single value is used across all locales<br>Editors can change the localization behavior on a per-instance basis. |  |
   | Allow conditional values | Set up multiple potential values and conditions for use.<br>Learn more about [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic/conditional-values). |  |
   | Use as display name | Setting this to **true** displays the link value as the component's name in the structure panel. For project map links, the node ID is shown. |  |

   `How Uniform stores the value: Project map`

   ```json
   {
      "type": "link",
      "value": {
         "type": "projectMapNode",
         "path": "/path/of/node#optional-anchor",
         "nodeId": "<some-id-value>",
         "projectMapId": "<some-id-value>",
         "attributes": {
            "target": "_blank",
            "data-campaign": "spring-sale"
         }
      }
   }  
   ```

   `How Uniform stores the value: Url, email address, or telephone number`

   ```json
   {
      "type": "link",
      "value": {
         "type": "url", // or "email" or "tel"
         "path": "https://example.com", // or "someone@email.com" or "+1 555 555 5555"
         "attributes": {
            "target": "_blank"
         }
      }
   }
   ```

   The optional `attributes` object only contains attributes the editor has set (empty values aren't stored), and its keys are governed by the parameter's allowed custom link attributes configuration. Anchors aren't stored as an attribute; the fragment is part of `path`.

   To render a link value in your front end, use the SDK helpers described in [Link Parameter Utilities](https://docs.uniform.app/docs/sdk/parameter-utilities/link-parameters), which derive the `href`, spread the editor-set attributes, and apply built-in security safeguards.
2. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
3. After all component updates are complete, make sure to **save the component** to apply your changes.

### Number

The number parameter lets a user enter a numeric value. You can configure how it appears in the editor (number field vs slider & number field).

![Number input field, number slider with 0–50 range, and number slider with discrete steps.](https://docs.uniform.app/images/guides/models/number-param-editors.png)

1. When adding a **number** parameter, enter the following values:

   | Name | Description | Notes |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Guidance | Instructions that help [Scout](https://docs.uniform.app/docs/guides/ai/scout) and [AI quick edits](https://docs.uniform.app/docs/guides/ai/ai-quick-edits) understand what content to generate for this parameter. Describe the expected format, length, writing style, or specific requirements. Keep it concise (1-2 sentences). Learn more about [AI guidance](https://docs.uniform.app/docs/guides/ai/ai-guidance). |  |
   | Required | Indicates whether setting a number is required when the component is used. Default: false. |  |
   | Editor | In **Editor settings**, choose **Number field** (default) or **Slider & number field** (slider plus numeric input). |  |
   | Integer | Use this when the number is a whole number (such as 3, 17, 101, 5000). | Radio button |
   | Decimal | Use this when the number is a fractional number (such as 12.44, 400.00, 1044.80). | Radio button |
   | Number of decimal places | This controls how precise a number can the user enter. | This option is only available for decimal numbers. |
   | Minimum | The user can't enter a value less than this. When **Slider & number field** is chosen, this defines the left end of the slider range. | Optional |
   | Maximum | The user can't enter a value greater than this. When **Slider & number field** is chosen, this defines the right end of the slider range. | Optional |
   | Use steps | When **Slider & number field** is chosen, enable this to make the slider move in fixed increments (e.g. 10). Optional. |  |
   | Localizable | Allows the parameter to be [localizable](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable).<br>If enabled, the default localization behavior can be set:<br>- Localized: One value can be set per locale<br>- Not localized: Single value is used across all locales<br>Editors can change the localization behavior on a per-instance basis. |  |
   | Allow conditional values | Set up multiple potential values and conditions for use.<br>Learn more about [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic/conditional-values). |  |
   | Use as display name | Setting this value to **true** will show what's entered in the **Number** field as the name of the component within the structure panel of a composition. |  |

   `How Uniform stores the value`

   ```json
   {
      "type": "number",
      "value": "####.##"
   }
   ```

   > **Tip:**
   >
   > Notice that the value is stored as a string, not as a number.
2. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
3. After all component updates are complete, make sure to **save the component** to apply your changes.

### Rich Text

With the rich text parameter, users can apply various formatting options such as heading levels, bold, italics, underline, strike through, and more to emphasize specific words or phrases. Additionally, it supports the inclusion of hyperlinks (both static and project map), bullet points, numbered lists, tables, and dynamic tokens.

1. When adding a **rich text** parameter, enter the following values:

   | Name | Description | Required |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Guidance | Instructions that help [Scout](https://docs.uniform.app/docs/guides/ai/scout) and [AI quick edits](https://docs.uniform.app/docs/guides/ai/ai-quick-edits) understand what content to generate for this parameter. Describe the expected format, length, writing style, or specific requirements. Keep it concise (1-2 sentences). Learn more about [AI guidance](https://docs.uniform.app/docs/guides/ai/ai-guidance). |  |
   | Required | Indicates whether setting a link is required when the component is used. Default: false. |  |
   | Allowed controls | Controls which formatting and element options are available to users. By default all options are enabled.<br>![Formatting options are bold, italic, underline, strike through, code, superscript, and subscript. Style options are normal and headings 1 through 6. Elements available include bulleted lists, ordered lists, links, block quotes, code blocks, tables, and dynamic tokens.](https://docs.uniform.app/images/guides/composition/components/parameters/allowed-rich-text-controls.png) |  |
   | Link configuration | When the link element is enabled, you can configure links inside the rich text just like a [Link parameter](#link): the **Allow anchors** toggle lets editors add a `#fragment` to project map links, and **Allowed custom link attributes** defines which HTML attributes editors can set on inline links. |  |
   | Localizable | Allows the parameter to be [localizable](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable).<br>If enabled, the default localization behavior can be set:<br>- Localized: One value can be set per locale<br>- Not localized: Single value is used across all locales<br>Editors can change the localization behavior on a per-instance basis. |  |
   | Allow conditional values | Set up multiple potential values and conditions for use.<br>Learn more about [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic/conditional-values). |  |
   | Use as display name | Setting this value to **true** will show what's entered in the **Rich text** field as the name of the component within the structure panel of a composition. |  |

   `How Uniform stores the value`

   ```json
   {
      "type": "richText",
      "value": {
         "root": {
            "type": "root",
            "children": []
         }
      }
   }
   ```
2. Click **Accept** on the bottom of the dialog to update the component configuration. To add a new parameter you can also select **Accept & add another** in the button dropdown.
3. After all component updates are complete, make sure to **save the component** to apply your changes.

### Text

The text parameter lets a user enter a text value. You can configure validation and multi-line behavior in the editor.

![Single-line text field and multi-line text field with resize handle.](https://docs.uniform.app/images/guides/models/text-param-editors.png)

1. When adding a **text** parameter, enter the following values:

   | Name | Description | Notes |
   | --- | --- | --- |
   | Name | A text field to enter a descriptive name for the parameter or its purpose. |  |
   | Public ID | Name that uniquely identifies the parameter. This value is available to developers, and is auto generated from the Name given. It can't be changed once it's created. |  |
   | Help text | A user is responsible for setting a value on the parameter. This text appears below the user-interface available for setting the parameter value.<br>![The user interface for setting the value on a text parameter with help text set to 'Enter a short description of the event.'](https://docs.uniform.app/images/guides/composition/components/parameters/configure-help-text.png)<br>![The help text in context of a composition.](https://docs.uniform.app/images/guides/composition/components/parameters/parameter-help-text.png) |  |
   | Guidance | Instructions that help [Scout](https://docs.uniform.app/docs/guides/ai/scout) and [AI quick edits](https://docs.uniform.app/docs/guides/ai/ai-quick-edits) understand what content to generate for this parameter. Describe the expected format, length, writing style, or specific requirements. Keep it concise (1-2 sentences). Learn more about [AI guidance](https://docs.uniform.app/docs/guides/ai/ai-guidance). |  |
   | Required | Indicates whether the value is required when the component is used. |  |
   | Allow multi-line text | If selected, the user enters the text into a multi-line text box. | Multi-line text is saved in a string with the line-break character `\n` used to separate lines. |
   | Lines count | Maximum number of lines of text the user can enter. | Only available when the allow multi-line text option is enabled. |
   | Validation Regex (optional) | Validation logic that limits the text the user can enter. | This uses the regular expression features in the user's browser. |
   | Test | If a value is entered it's checked against the validation regex. |  |
   | Validation Regex Message | Message displayed to the user when the input doesn't match the validation regex. | Only used if the validation regex is specified. |
   | Localizable | Allows the parameter to be [localizable](https://docs.uniform.app/docs/guides/composition/localization#make-a-property-localizable).<br>If enabled, the default localization behavior can be set:<br>- Localized: One value can be set per locale<br>- Not localized: Single value is used across all locales<br>Editors can change the localization behavior on a per-instance basis. |  |
   | Allow conditional values | Set up multiple potential values and conditions for use.<br>Learn more about [conditional values](https://docs.uniform.app/docs/guides/composition/conditional-logic/conditional-values). |  |
   | Use as display name | Setting this value to **true** will show what's entered in the **Text** field as the name of the component within the structure panel of a composition. |  |

   `How Uniform stores the value`

   ```json
   {
      "type": "text",
      "value": "######################"
   }
   ```

### Custom parameters

It is possible to implement your own [custom parameter types](https://docs.uniform.app/docs/integrations/mesh-integrations/locations/parameter-type) with custom visuals, validation, and data formats using [custom integrations](https://docs.uniform.app/docs/integrations/mesh-integrations/custom-integrations).

> **Tip:**
>
> When you add an [integration](https://docs.uniform.app/docs/integrations) to your project, new parameter types can be enabled on your project.
>
> Consult each integration's documentation for information about the parameter types it includes.

## Group parameters

Component parameters may be grouped to help cluster related ideas together in the Canvas editor. For example, you may collect fields for meta title and meta description in a group called "Meta data."

![Parameters grouped in a component.](https://docs.uniform.app/images/guides/composition/components/parameters/groups-in-composition.png)

1. To create a parameter group, navigate to **Experience > Components** and select the appropriate component in your project.
2. Click the tab **Parameters**.
3. Click the chevron on the **Add parameter** button to open the menu
4. Select “Add parameter group”
5. Enter the following values:

   | Field | Description |
   | --- | --- |
   | Name | The group name will be displayed in the canvas editor. it's the only label visible when the group is collapsed. |
   | Is collapsed by default? | If checked, the group will be collapsed by default. If unchecked, it will be expanded by default. Editors can always expand or collapse the group in the canvas editor.<br>Default: checked |
6. Click **OK** to save your changes.
7. Click **Save** to save the changes to the component.

   ![A group of parameters in the parameter view of a component.](https://docs.uniform.app/images/guides/composition/components/parameters/create-parameter-group.png)
8. Parameters can be added to the group by dragging and dropping them into the group. Groups can also be rearranged in the same way. The order shown in the table is the order they will be displayed in the Canvas editor.

> **Note:**
>
> Placing a parameter in a group doesn't modify the API response from Uniform.

## Delete a parameter

1. In your project, navigate to **Experience > Components** and select your component.
2. Click the tab **Parameters**.

   ![The parameters tab on the component page.](https://docs.uniform.app/images/guides/composition/components/parameters/delete-parameter.png)
3. Click ** > Delete**.
4. Click **Save** to save the changes to the component.

> **Note:**
>
> If the deleted parameter is used in any composition, when you  
> select the component in a composition you will see a warning  
> about "orphan parameter data." This tells you that Uniform is
> storing a value for a parameter that's not defined in the
> component. You must remove this value before you are able
> to save any changes to the composition.
>
> Click **Remove** to remove this value
> from the composition.

![Orphan parameter warning.](https://docs.uniform.app/images/guides/composition/components/parameters/remove-orphan-parameter-data.png)
