Counter Cards

The Counter Module is a powerful tool designed to highlight key metrics, achievements, and data points on your HubSpot website. Ideal for showcasing performance indicators, milestones, or statistical highlights, this module combines dynamic animations with customization options to enhance your site's visual appeal and engagement.

Key Features:

• Fully Responsive Across All Devices: Ensures a consistent and engaging experience on desktops, tablets, and mobile devices, adapting seamlessly to different screen sizes.

• Three Elegant Variants: Choose from three refined design styles to match your branding and aesthetic preferences. Each variant offers a unique look to enhance the presentation of your counters.

• Variety of Style Options: Customize colors, fonts, and other design elements to align with your brand’s identity. Adjust settings to create a cohesive and visually appealing display.

• Flexible Column Layout Options: Select from single, double, triple, or four-column layouts. Rearrange columns easily to fit your content and design needs, achieving the perfect layout for your page.

• Counter Repeater: Add and customize multiple counters with options to set images/icons, titles, and additional content. Tailor each counter to display different metrics or achievements.

• Layout-Specific Settings:

  • Layout 1: Four-column layout with options for images/icons and titles.

  • Layout 2: Four-column layout with image/icon options and titles, including an additional image setting.

  • Layout 3: Two-column layout with one column for an image and the adjacent column for counter content.

• Customizable Typography: Adjust font size, weight, and line height for titles and counter values across both mobile and desktop views. Fine-tune the appearance to fit your content and design requirements.

• Design Customization: Customize background colors, spacing, border radius, and text alignment. Apply box shadows, borders, and background hover colors to match your branding.

• Interactive Effects: Set hover colors for text, icons, and counter values to add interactive visual effects and enhance user engagement.

• Content Customization: Modify headings, descriptions, and other text elements. Adjust images, icons, and visual components to ensure the module integrates seamlessly with your site’s design.