search
HomeForumHelp

Icon

circle-info

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.

chevron-rightToggle iconhashtag

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

hashtag
Select Icon

Use the Icon Selector to select the desired icon.​

chevron-rightOpen icon selectorhashtag

  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

Iconchevron-right

hashtag
Icon Colour

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

chevron-rightModify icon colourhashtag

  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

hashtag
Icon Size

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

hashtag
Spacing

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

chevron-rightModify icon spacinghashtag

  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

hashtag
Flex Position

Allows you to flex position your Icon.

hashtag
Vertical Position

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

chevron-rightModify icon vertical positionhashtag

  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

hashtag
Specific Icons

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

Activate/deactivate the icon for specific element.

chevron-rightActivate/deactivate icon for specific elementhashtag

  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

Last updated