# Properties (Add)

Properties allows you to add a new Property or a new Group.

Properties you can add to a component include Text, Rich Text, List, Link, Image, Gallery, Video, Icon, Colour, Toggle, Number, Class, ID, Options, Conditions, Visibility, CSS Text.

## Text Property

The Text Property allows you to add a Name, Default, Placeholder, Canvas Placeholder and Type (Static or Advanced) to your Component.&#x20;

{% content-ref url="/pages/tS0O7TF7OC75FPLSQmfw" %}
[Text Property](/cwicly/components/properties-add/text-property.md)
{% endcontent-ref %}

## Rich Text Property

The Rich Text Property allows you to add rich text to a component, such as bold, italic, underline or strikethrough.

{% content-ref url="/pages/fzpZwPotyih6irPU3Jg7" %}
[Rich Text Property](/cwicly/components/properties-add/rich-text-property.md)
{% endcontent-ref %}

## List Property

The List Property allows you to add a list to a component.  Input required information such as Name, Default, Placeholder, Canvas Placeholder.&#x20;

{% content-ref url="/pages/7YzFW9qTQGKRLEO1Jzvd" %}
[List Property](/cwicly/components/properties-add/list-property.md)
{% endcontent-ref %}

## Link Property

{% content-ref url="/pages/AWmeobUfk4mHVAAM5IuK" %}
[Link Property](/cwicly/components/properties-add/link-property.md)
{% endcontent-ref %}

## Image Property

The Image Property allows you to add an Image to a component, to name it, to set a Default image, to choose an URL and choose a simple (static) or advanced (static and dynamic) type.

{% content-ref url="/pages/3MWTbzW7idw45tIC6zot" %}
[Image Property](/cwicly/components/properties-add/image-property.md)
{% endcontent-ref %}

## Gallery Property

The Gallery Property allows you to add a Gallery to a component, to name it, choose the data type and adjust layout and usage.

{% content-ref url="/pages/o4IH3UnMAva1E7jhReSu" %}
[Gallery Property](/cwicly/components/properties-add/gallery-property.md)
{% endcontent-ref %}

## Video Property

The Video Property allows you to add a Video to a component, to name it, to set a Default video, to choose an URL and choose a simple (static) or advanced (static and dynamic) type.

{% content-ref url="/pages/bLhcAyilalaNOY7UmWJW" %}
[Video Property](/cwicly/components/properties-add/video-property.md)
{% endcontent-ref %}

## Icon Property

The Icon Property allows you to configure your icon property. You can input a Name and choose a suitable icon and choose whether or not to include it in the CSS so that you can use it in a List block.

{% content-ref url="/pages/i6gKbbhg1J3RIYJNDYAZ" %}
[Icon Property](/cwicly/components/properties-add/icon-property.md)
{% endcontent-ref %}

## Colour Property

The Colour Property allows you to configure a colour property.&#x20;

You can input a Name, decide whether it should be Responsive or not and choose a suitable Default colour.

{% content-ref url="/pages/VWvhtRqwbfUYckdXK801" %}
[Colour Property](/cwicly/components/properties-add/colour-property.md)
{% endcontent-ref %}

## Toggle Property

The Toggle Property allows you to configure a toggle state for boolean values. This means that the icon property can be shown or hidden for any property that only has two possible states (true/false).

You can input a suitable Name, and decide whether it should be shown or hidden by Default.

{% content-ref url="/pages/a4UyS0k0I1oE9M5lQOEk" %}
[Toggle Property](/cwicly/components/properties-add/toggle-property.md)
{% endcontent-ref %}

## Number Property

The Number Property allows you to configure a number property such as font size, padding, width etc.&#x20;

You can input a Name, decide whether it should be Responsive or not, set a Default value, and a Minimum, a Maximum or Step.&#x20;

You can also toggle "With Unit" on or off if you want to specify a unit.

{% content-ref url="/pages/qYfQHQ0iveGwsJCqQl4F" %}
[Number Property](/cwicly/components/properties-add/number-property.md)
{% endcontent-ref %}

## Class Property

The Class Property allows you to configure a single (or multiple) class property(ies).

You can input a Name and decide whether a Class should be added to the selected component by default or not.

{% content-ref url="/pages/M6XIpndBFywMWzKTmLhk" %}
[Class Property](/cwicly/components/properties-add/class-property.md)
{% endcontent-ref %}

## ID Property

The ID Property gives an ID to the block if you wish to give it a specific name in order to target it more easily (for example to connect it to a modal).

By default the Block ID is indexed relative to the number of blocks on the page.

{% content-ref url="/pages/EyJfXB5Dh5HoECxS1rPE" %}
[ID Property](/cwicly/components/properties-add/id-property.md)
{% endcontent-ref %}

## Options Property

The Options Property allows you to add specific additional styles to a component other than numbers and colours.&#x20;

You can input a Name, set a default style and set options for the default as required.

{% content-ref url="/pages/ybPGuKQ9aikIpTHFEZ12" %}
[Options Property](/cwicly/components/properties-add/options-property.md)
{% endcontent-ref %}

## Conditions Property

The Conditions Property allows you to add specific additional styles to a component other than numbers and colours.&#x20;

You can input a Name and set specific conditions for a component block.

{% content-ref url="/pages/HbR06YgOPweXxSM93Cqe" %}
[Conditions Property](/cwicly/components/properties-add/conditions-property.md)
{% endcontent-ref %}

## Visibility Property

The Visibility Property allows you to Show/Hide a block and set a default state.&#x20;

{% content-ref url="/pages/tYHVAG6aJd7NALP4SuZb" %}
[Visibility Property](/cwicly/components/properties-add/visibility-property.md)
{% endcontent-ref %}

## CSS Property

CSS Text accepts any valid CSS string values.&#x20;

You can add a Name, Default, and make it responsive or not as required.&#x20;

{% content-ref url="/pages/VOQ2BCwOvcPOq52R49TJ" %}
[CSS Text Property](/cwicly/components/properties-add/css-text-property.md)
{% endcontent-ref %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.cwicly.com/cwicly/components/properties-add.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
