Overlapping Cards is a section that displays content with layered images and text.
As users scroll, the text smoothly moves upward and overlaps the image, creating a seamless transition between cards.
This effect gives your store a modern, premium look while making the content more engaging and visually dynamic.
These settings control the overall layout and behavior of the section:
Option | Description | Recommendation |
|---|---|---|
Color scheme | Defines the background and text colors | Match with your brand identity |
Desktop center align content | Centers text content on desktop | Use for a clean, balanced layout |
Desktop image placement | Controls image position (First / Second) | First = left, Second = right |
Alternate | Alternates layout between cards | Enable for better visual rhythm |
Caption | Small text above the section heading (Available from Vetro 3.0.0) | Use for a tagline or category |
Heading | Main section title (Available from Vetro 3.0.0) | Keep it short and clear |
Each block represents a single content item with its own image and text.
Option | Description | Recommendation |
|---|---|---|
Image | Main desktop image | Recommended size: 2400 × 2400px |
Image mobile | Mobile-specific image | Use to optimize mobile display |
Option | Description | Recommendation |
|---|---|---|
Subheading | Small text above the heading | Use for tags like “RENEW & GLOW” |
Subheading font | Font style for subheading | Heading = stronger, Body = softer |
Subheading size | Size of subheading | Keep small for better hierarchy |
Heading | Main title | Clear and impactful |
Heading size | Size of heading | Increase if emphasis is needed |
Heading tag | HTML tag (H1, H2, etc.) | Use H2 for proper SEO structure |
Description | Supporting text | Keep it concise (2–4 lines) |
Configure the button to guide users to your desired page or product.
You can customize its text, link, size, and style to match your design and CTA strength.
