Card
Cards are widely used blocks to display content such as titles, text, images, or actions (buttons, links, etc.). Thanks to these dropdown menus, you can adapt the card style to your site without coding, simply by selecting the options that suit you.
🎨 Card element colors Modify the main colors used in the cards:
Text color: changes the color of the general textual content.
Background color: modifies the card’s background.
Title color: customizes the main title’s color.
Subtitle color: adjusts the color of the subtitle or secondary text.
Border color: changes the card’s outline color.
Cap Background: background color of the card’s top area (header), if used.
Cap Color: text color inside the top area (header).
📏 Internal spacing (padding) These settings allow you to adjust the space inside the card and its components:
Title vertical spacing: adds space above and below the title.
General vertical spacing: space top/bottom inside the entire card content.
General horizontal spacing: space left/right inside the card.
Cap Padding Y: vertical space inside the “Cap” (header) part.
Cap Padding X: horizontal space inside the “Cap” part.
Image Overlay padding: space around the image when displayed as an overlay (over the content).
🧱 Borders and rounded corners Customize the border appearance to style your cards:
Border width: defines the visible outline thickness of the card.
Outer border radius: rounds the card’s outer corners.
Inner border radius: rounds the inner corners of areas like the header or the image.
Group margin: space between multiple cards displayed in a group (e.g., card group or grid).
Last updated