Icon

Make sure to activate the icon toggle.

When activated, the Icon property allows you to choose whether you want the list bullet to be an icon.

Toggle icon

The Icon can be activated from the Block Inspector or the ToolbarSelect an list block.

From the Block Inspector:

1. Select a list block

2. Open the Block Inspector

3. Navigate to the Primary tab

4. Open the Icon tab​​

5. Find the Active property

6. Toggle the the Active property on to activate it

From the Toolbar

1. Select a list block

2. Click Icon list to toggle Icon on or off

Select Icon

Use the Icon Selector to select the desired icon.​

Open icon selector

1. Select a list block

2. Open the Block Inspector

3. Navigate to the Primary tab

4. Open the Icon tab

5. Find the Icon property

6. Click on the 🌏 icon to open the Icon Selector

pageIcon

Icon Colour

The Icon Colour property allows you to define the icon colour.

Modify icon colour

1. Select a list block

2. Open the Block Inspector

3. Navigate to the Primary tab

4. Open the Colours tab

5. Open the colour picker by clicking on the colour circle

6. Select your colour in the colour picker or click on a global colour

Icon Size

The Icon Size property allows you to choose the size of your Icon.

Spacing

The Spacing property allows you to define the margin added between the icon and list text.

Modify icon spacing

1. Select a list block

2. Open the Block Inspector

3. Navigate to the Primary tab

4. Navigate to the Settings tab

5. Find the Spacing property

6. Enter the desired spacing value

Flex Position

Allows you to flex position your Icon.

Vertical Position

The Vertical Position property allows you to define the vertical position relative to the text element in the list.

Modify icon vertical position

1. Select a list block

2. Open the Block Inspector

3. Navigate to the Primary tab

4. Navigate to the Settings tab

5. Find the Vertical Position property

6. Enter the desired value

Specific Icons

The list block allows you to choose specific icons for every list element.​

Activate/deactivate the icon for specific element.

Activate/deactivate icon for specific element

1. Select a list block

2. Open the Block Inspector

3. Navigate to the Primary tab

4. Open the Icon tab

5. Click on the Specific Icons icon
6. Find the List element you want to define an icon for

7. Toggle the List Icon x property (x being the position of the element in the list)

8. Select an icon using the Icon Selector