Product Template

Split Card OG Image Template

A floating white card on a light gray background with a colored left border. Clean, modern, and professional for product and service pages.

Professional Services That Scale With You
From startups to enterprise — we help you grow

What is the Split Card Template?

The Split Card template features a white card with rounded cornersfloating on a light gray (#f5f5f5) background, elevated by a subtle box shadow. A 6px colored border on the left edge provides a brand accent without overwhelming the clean design.

The title is rendered in near-black (#111) at 46px, 700 weight, and the subtitle in medium gray (#666). The card has generous padding (60x70px) so text breathes comfortably.

This design pattern is ubiquitous in modern web design — it's the same card pattern used in dashboards, pricing pages, and feature sections. When someone sees this OG image, it subconsciously signals "professional, trustworthy company."

Best Use Cases

Product Pages

Professional previews for your product landing pages

Service Descriptions

Consulting, agency, and service page social shares

Case Studies

Business case studies that need a corporate look

E-commerce Launches

Product launch previews with a clean, trusted design

Customization Guide

Accent Color: The left border color is your brand color. This is the only colored element, so it carries all the visual identity. Use your primary brand color for consistency.

Background: The card is white on light gray, which means it works well on both light and dark social feeds. The contrast is subtle enough to look native on any platform.

Template Specifications

Output size: 1200 x 630 pixels
Aspect ratio: 1.91:1
Format: PNG
Font: Inter / system sans-serif
Title size: 46px, 700 weight
Subtitle size: 22px, 400 weight, #666
Background: #f5f5f5 (light gray)
Card: White, 24px radius, accent border

Frequently Asked Questions

Why does this template look like a card?

The card pattern is one of the most recognizable UI patterns on the web. It signals professionalism and trust, making it ideal for business and product pages.

Does the light background show up on dark mode feeds?

Yes. The white card on light gray creates a self-contained element with its own contrast. Platforms like Twitter/X in dark mode will display it with appropriate spacing around it.

Can I change the card background color?

The card is fixed at white (#fff) as part of the template design. If you want a different card color, the Bold Gradient template might be a better fit.

What accent color works best?

Use your brand color for consistency. If you don't have a brand color, blue (#3b82f6) or indigo (#6366f1) are safe choices that convey trust and professionalism.

Try the Split Card Template

Open the editor with this template pre-selected. Customize and download in seconds.

Open in Editor →