Skip to main content




Applies only to Traditional Web Apps




  • Edit
  • Groups information in a small block that is easily noticeable in the screen.

    Use Cards to group small pieces of information and highlight them on the screen.

    How to use

    Drag the pattern to the screen and edit the content to match your requirements.

    1. Drag the Card pattern into the preview.

    2. Set the content you need in the placeholder.

    3. Publish and test.

    Input Parameters

    Input Name Description Type Mandatory Default Value
    ExtendedClass Add custom style classes to this Block. Text False none

    Layout and Classes

    Advanced Use Case

    Change background-color

    1. Write the following classes in the ExtendedClass property of the card. background-yourcolor text-neutral-0 border-size-none

      The class text-neutral-0 is to set the text-color to white, in contrast with the new background. The border-size-none class is to remove the border.

    2. Publish and test.



    • Was this article helpful?