Get Started

Marketing Web Modules

Back to All Modules

CTA Cards - Photo

Search (CSOL) CTA Cards - Photo in the CMS

Jump to Guidelines and Use Cases

Theme Options:

Module Preview
sg-defaults_figures

Educational Resources and Tailored Training

Content, masterclasses, training, and 24/7 support to get your business acquiring and retaining more customers, faster. Plus, you’ll have access to world-class support from HubSpot experts alongside a tailored onboarding experience.
Learn more
sg-defaults_garden Popular

Professional Software, Exclusive Pricing

The HubSpot Growth Platform is a full suite of software for marketing, sales, and customer service, with a completely free CRM at its core. The software grows with you, so you'll have access to in-person product training, too. All at an exclusive price.
Learn more
sg-defaults_hq-large

Integrated Platform For Scaling Companies

Access to over 500 integrations, including Stripe, Zapier, and more. They integrate seamlessly with HubSpot, so you can extend your capabilities and grow your company faster. Plus, you can integrate your company with HubSpot and grow on our platform.
Learn more
sg-defaults_figures

Educational Resources and Tailored Training

Content, masterclasses, training, and 24/7 support to get your business acquiring and retaining more customers, faster. Plus, you’ll have access to world-class support from HubSpot experts alongside a tailored onboarding experience.
Learn more
sg-defaults_garden Popular

Professional Software, Exclusive Pricing

The HubSpot Growth Platform is a full suite of software for marketing, sales, and customer service, with a completely free CRM at its core. The software grows with you, so you'll have access to in-person product training, too. All at an exclusive price.
Learn more
sg-defaults_hq-large

Integrated Platform For Scaling Companies

Access to over 500 integrations, including Stripe, Zapier, and more. They integrate seamlessly with HubSpot, so you can extend your capabilities and grow your company faster. Plus, you can integrate your company with HubSpot and grow on our platform.
Learn more
sg-defaults_figures

Educational Resources and Tailored Training

Content, masterclasses, training, and 24/7 support to get your business acquiring and retaining more customers, faster. Plus, you’ll have access to world-class support from HubSpot experts alongside a tailored onboarding experience.
Learn more
sg-defaults_garden Popular

Professional Software, Exclusive Pricing

The HubSpot Growth Platform is a full suite of software for marketing, sales, and customer service, with a completely free CRM at its core. The software grows with you, so you'll have access to in-person product training, too. All at an exclusive price.
Learn more
sg-defaults_hq-large

Integrated Platform For Scaling Companies

Access to over 500 integrations, including Stripe, Zapier, and more. They integrate seamlessly with HubSpot, so you can extend your capabilities and grow your company faster. Plus, you can integrate your company with HubSpot and grow on our platform.
Learn more
Module Preview

FAQ's

How To Use This Module

These cards are a great way to group content and surface content to users in a digestible manner.

Use Cases

Card Content

Each card includes:

  • Optional image (recommended 550px x 350px, small or default size)
  • Optional title (used as button text if interactive mode enabled)
  • Optional rich text description
  • Optional social media links (linkedin, twitter, email, and more)
  • Single CTA (button or interactive card link)
  • Optional ribbon badge (neutral, brand, positive, negative)

Display Options

Choose between grid or carousel layouts. Carousel displays 1 slide on mobile, 2 on tablet, 3 on desktop with configurable scroll behavior (1 slide or all visible slides).

Interactive Cards

Enable interactive mode to make entire card clickable, triggering the CTA link. CTA text and button are hidden in this mode, with title acting as the link text.

Customization

  • Card themes: White, Light, or Dark
  • Text alignment: Balanced, Left, or Center
  • Image size: Default (full-width) or Small (180px, center aligned, beta)
  • Badge ribbon positioning (left side)
Get on-brand assets for your module
BrandfolderCanva

Guidelines

Character Count

  • Limit header text to ~40 characters
  • Limit CTA text to 2 or 3 words (~15 characters)
  • No distinct limit for body copy, but each card should contain roughly the same amount of text for an even look.

Image Sizing

  • Images will be scaled to fit the full width of the card. We recommend using images that are 550px wide
  • For a clean look, make sure all images have the same height and width

Similar Modules

updated

CTA Cards - Product Logos

Highlight details about a specific HubSpot product or offer with these CTA Cards.

updated

CTA Content Block

Draw attention to a final call-to-action for your page.

Slide-In CTA

A CTA that slides into view as the user scrolls.

What's New?

| v5.12.1 May 2026

  • Each card now supports optional social media links, rendered as icon buttons between the description and CTA.

| v4.0.0 October 2025

  • Added an option to make cards in the CTA Cards module fully interactive. When enabled, clicking anywhere on a card will trigger its associated CTA. In this mode, the CTA link or button is not displayed separately—the entire card acts as the clickable element.

| v2.33.0 July 2025

  • Added cards text alignment setting to give users the option to choose from balanced, left and center text alignment options.

| v2.19.0 November 2024

  • Added a badge option to give users the option to assign a badge to each card. Users can choose from neutral, brand & positive badge types.
  • CTA Cards - Photo has be updated to use container queries so the module can be used on the Blog.

| v2.13.0 August 2024

  • Added a new "Display Type" option to give users the option to display the cards in a carousel.
  • Added a new "CTA Type" option called "Back to Top" which will move the user to the top of the page if selected.

| v2.11.0 June 2024

  • Allows CTA styling options so user can set a Type (button versus text link) and Button Style (i.e primary, secondary or tertiary

| v1.0.0 August 2022

  • Now you can add as many cards as you want!