Feature Card

Explain a benefit with an icon and description.

How to use

Write the benefit as the heading and explain it in the body.
Choose an image and set layout and colors.
Keep matching dimensions and copy density across adjacent cards.

Things to check

Long copy may exceed a fixed height; enlarge the area or shorten the text.

Property reference

Select the module in the editor to change its settings. Technical identifiers below are kept unchanged for reference; some advanced fields are stored as structured data rather than separate controls.

Find a property

31 / 31

backgroundColor

Sets the color of the associated element or surface. Use the color picker and check text contrast.

string

borderColor

Sets the color of the associated element or surface. Use the color picker and check text contrast.

string

borderRadius

Changes the associated element dimension or spacing. Follow the editor unit and check overflow or cropping.

number

borderWidth

Changes the associated element dimension or spacing. Follow the editor unit and check overflow or cropping.

number

buttonColor

Sets the color of the associated element or surface. Use the color picker and check text contrast.

string

buttonText

Visible copy or a label for this element. Write concise, descriptive content and check it fits the layout.

string

buttonTextColor

Sets the color of the associated element or surface. Use the color picker and check text contrast.

string

compact

Enables or disables the associated behavior or visible element. Check the result in presentation preview.

boolean

contentVerticalAlign

Sets the associated element alignment, placement or direction; preview it within the content area.

'top' | 'center' | 'bottom'

description

Visible copy or a label for this element. Write concise, descriptive content and check it fits the layout.

string

descriptionColor

Sets the color of the associated element or surface. Use the color picker and check text contrast.

string

descriptionFontSize

Changes the associated element dimension or spacing. Follow the editor unit and check overflow or cropping.

number

hoverEffect

Enables or disables the associated behavior or visible element. Check the result in presentation preview.

boolean

imageBorderRadius

Changes the associated element dimension or spacing. Follow the editor unit and check overflow or cropping.

number

imagePosition

Sets the associated element alignment, placement or direction; preview it within the content area.

'top' | 'left' | 'right'

imageSize

Changes the associated element dimension or spacing. Follow the editor unit and check overflow or cropping.

number

imageUrl

An image, media or link source. Use the media picker or an accessible URL and verify it loads in the presentation.

string

linkUrl

An image, media or link source. Use the media picker or an accessible URL and verify it loads in the presentation.

string

opacity

Visibility ratio: 0 is fully transparent and 1 is fully opaque.

number

padding

Changes the associated element dimension or spacing. Follow the editor unit and check overflow or cropping.

number

shadowBlur

Changes the associated element dimension or spacing. Follow the editor unit and check overflow or cropping.

number

shadowColor

Sets the color of the associated element or surface. Use the color picker and check text contrast.

string

shadowEnabled

Enables or disables the associated behavior or visible element. Check the result in presentation preview.

boolean

shadowOffsetX

Changes the associated element dimension or spacing. Follow the editor unit and check overflow or cropping.

number

shadowOffsetY

Changes the associated element dimension or spacing. Follow the editor unit and check overflow or cropping.

number

showButton

Enables or disables the associated behavior or visible element. Check the result in presentation preview.

boolean

textAlign

Sets the associated element alignment, placement or direction; preview it within the content area.

'left' | 'center' | 'right'

title

Visible copy or a label for this element. Write concise, descriptive content and check it fits the layout.

string

titleColor

Sets the color of the associated element or surface. Use the color picker and check text contrast.

string

titleFontSize

Changes the associated element dimension or spacing. Follow the editor unit and check overflow or cropping.

number

titleFontWeight

Font weight. Use consistent weights for text at the same level of emphasis.

'normal' | 'bold' | 'light'