agent-skills/sn-infographic/references/layouts/top-image-bottom-text.md

top-image-bottom-text

Image at the top, text content below.

Structure

• Upper half (50-70%): full-width image or illustration
• Lower half (30-50%): text content area
• Clear horizontal dividing line or natural transition
• Text area may include title, body, and CTA

Best For

• Article or blog post covers
• Product announcements with visual lead
• Educational cards with concept illustration
• Social media posts

Visual Elements

• Dominant image filling the top zone
• Clean text area below with good typography
• Optional color band or shape as transition element

Text Placement

• Title immediately below the image
• Body text beneath the title
• CTA or caption at the bottom

Recommended Pairings

• corporate-memphis: Clean editorial cards
• storybook-watercolor: Illustrated story cards
• paper-collage: Friendly educational posts