Banner Generation Prompts¶

Prompt templates for social media, email, and advertising banners with parameterized design system integration

Created: February 2026 Tool: Nano Banana Pro Related: Framework Overview | Visual Identity

Design System Configuration¶

This file inherits from the parent design system framework. All tokens resolve based on active configuration.

# CONFIGURATION BLOCK - Inherits from readme.md
parent_framework: "./readme.md"
schema_version: "2.0"

# Active Configuration (override in skill or use parent defaults)
active_configuration:
  variant: "{{ACTIVE_VARIANT}}"           # Default: trusted_advisor
  grid_system: "{{GRID_STYLE}}"           # Default: subtle_grid
  frame_style: "{{FRAME_TYPE}}"           # Default: frame_solid
  dark_mode: "{{DARK_MODE}}"              # Default: false

# Token Resolution
tokens_from_parent:
  colors: "variant_{{active_variant}}.colors"
  typography: "variant_{{active_variant}}.typography"
  visual: "variant_{{active_variant}}.visual"
  frames: "variant_{{active_variant}}.frames"
  prompt_prefix: "variant_{{active_variant}}.prompt_prefix"

# Banner-Specific Defaults
banner_defaults:
  corner_radius: "{{sizing_tokens.radius_lg}}"
  shadow: "{{shadow_tokens.shadow_md}}"
  text_contrast: "WCAG AA minimum"

Trusted Advisor (Default)¶

Professional stability for established credibility.

variant_banner_styling_trusted_advisor:
  primary_color: "{{sbk_blue}}"           # #2563eb
  secondary_color: "{{sbk_navy}}"         # #0f172a
  background: "{{cool_white}}"            # #f8fafc
  text_primary: "{{slate_900}}"           # #0f172a
  text_inverse: "{{white}}"               # #ffffff
  accent: "{{sbk_sky}}"                   # #0ea5e9

  frame_style: "frame_solid"
  frame_opacity: 0.1
  grid_system: "subtle_grid"
  corner_radius: "{{radius_lg}}"          # 8px

  gradient: "linear-gradient(135deg, {{sbk_blue}} 0%, {{sbk_navy}} 100%)"
  texture: "subtle-paper-grain"
  texture_opacity: 0.03

  cta_style:
    background: "{{sbk_blue}}"
    text: "{{white}}"
    border_radius: "{{radius_lg}}"
    hover: "{{sbk_navy}}"

  recommended_for:
    - linkedin_banners
    - email_headers
    - professional_display_ads
    - webinar_banners
    - conference_materials

Modern Partner¶

Collaborative warmth for approachable messaging.

variant_banner_styling_modern_partner:
  primary_color: "{{teal_600}}"           # #0d9488
  secondary_color: "{{cyan_600}}"         # #0891b2
  background: "{{warm_cream}}"            # #faf5f0
  text_primary: "{{slate_800}}"           # #1e293b
  text_inverse: "{{white}}"               # #ffffff
  accent: "{{cyan_500}}"                  # #06b6d4

  frame_style: "frame_solid"
  frame_opacity: 0.08
  grid_system: "minimal_grid"
  corner_radius: "{{radius_xl}}"          # 12px

  gradient: "linear-gradient(135deg, {{teal_600}} 0%, {{cyan_600}} 100%)"
  texture: "organic-flow"
  texture_opacity: 0.02

  cta_style:
    background: "{{teal_600}}"
    text: "{{white}}"
    border_radius: "{{radius_xl}}"
    hover: "{{teal_700}}"

  recommended_for:
    - partnership_announcements
    - community_content
    - collaborative_campaigns
    - customer_success_stories

Bold Challenger¶

Confident disruption for attention-grabbing campaigns.

variant_banner_styling_bold_challenger:
  primary_color: "{{slate_900}}"          # #0f172a
  secondary_color: "{{slate_700}}"        # #334155
  background: "{{white}}"                 # #ffffff
  text_primary: "{{slate_900}}"           # #0f172a
  text_inverse: "{{white}}"               # #ffffff
  accent: "{{orange_600}}"                # #ea580c
  accent_bright: "{{orange_500}}"         # #f97316

  frame_style: "frame_solid"
  frame_opacity: 0.2
  grid_system: "structured_grid"
  corner_radius: "{{radius_md}}"          # 6px

  gradient: "none"                        # Flat color blocks
  texture: "sharp-geometric"
  texture_opacity: 0

  cta_style:
    background: "{{orange_600}}"
    text: "{{white}}"
    border_radius: "{{radius_md}}"
    hover: "{{orange_700}}"

  recommended_for:
    - attention_grabbing_ads
    - competitive_differentiation
    - product_launches
    - sales_promotions
    - retargeting_action

Cyber Shield¶

Security-focused aesthetic for threat protection messaging.

variant_banner_styling_cyber_shield:
  primary_color: "{{red_600}}"            # #dc2626
  secondary_color: "{{slate_900}}"        # #0f172a
  background: "{{dark_bg_primary}}"       # #0a0a0b
  text_primary: "{{dark_text_primary}}"   # #fafafa
  text_secondary: "{{dark_text_secondary}}" # #a1a1aa
  accent: "{{red_500}}"                   # #ef4444
  glow_color: "{{red_400}}"

  frame_style: "frame_glow"
  frame_opacity: 0.4
  grid_system: "cyber_grid"
  corner_radius: "{{radius_sm}}"          # 2px

  gradient: "linear-gradient(180deg, {{dark_surface}} 0%, {{dark_bg_primary}} 100%)"
  texture: "scan-lines"
  texture_opacity: 0.02
  glow_effect: "0 0 16px {{red_600}}40"

  cta_style:
    background: "{{red_600}}"
    text: "{{white}}"
    border_radius: "{{radius_sm}}"
    glow: "0 0 8px {{red_600}}60"
    hover: "{{red_500}}"

  dark_mode: true

  recommended_for:
    - security_service_ads
    - threat_alerts
    - compliance_campaigns
    - penetration_testing_promos

Sentinel Guard¶

AI-powered defense aesthetic for autonomous protection.

variant_banner_styling_sentinel_guard:
  primary_color: "{{purple_600}}"         # #9333ea
  secondary_color: "{{violet_600}}"       # #7c3aed
  background: "{{dark_bg_primary}}"       # #0a0a0b
  text_primary: "{{dark_text_primary}}"   # #fafafa
  text_secondary: "{{dark_text_secondary}}" # #a1a1aa
  accent: "{{fuchsia_500}}"               # #d946ef
  glow_color: "{{purple_400}}"

  frame_style: "frame_gradient"
  frame_opacity: 0.3
  grid_system: "dashboard_grid"
  corner_radius: "{{radius_lg}}"          # 8px

  gradient: "linear-gradient(135deg, {{purple_600}} 0%, {{violet_600}} 50%, {{fuchsia_500}} 100%)"
  texture: "neural-network"
  texture_opacity: 0.03
  glow_effect: "0 0 24px {{purple_600}}30"

  cta_style:
    background: "linear-gradient(135deg, {{purple_600}}, {{violet_600}})"
    text: "{{white}}"
    border_radius: "{{radius_lg}}"
    glow: "0 0 12px {{purple_500}}50"
    hover_brightness: 1.1

  dark_mode: true

  recommended_for:
    - ai_security_campaigns
    - managed_detection_response
    - soc_services
    - automation_messaging

Clean Developer¶

Developer-focused clarity for technical excellence.

variant_banner_styling_clean_developer:
  primary_color: "{{indigo_600}}"         # #4f46e5
  secondary_color: "{{violet_600}}"       # #7c3aed
  background: "{{white}}"                 # #ffffff
  text_primary: "{{slate_900}}"           # #0f172a
  text_secondary: "{{slate_600}}"         # #475569
  accent: "{{cyan_500}}"                  # #06b6d4
  code_bg: "{{slate_100}}"                # #f1f5f9

  frame_style: "frame_solid"
  frame_opacity: 0.08
  grid_system: "minimal_grid"
  corner_radius: "{{radius_lg}}"          # 8px

  gradient: "linear-gradient(135deg, {{indigo_600}} 0%, {{violet_600}} 100%)"
  texture: "none"
  texture_opacity: 0

  cta_style:
    background: "{{indigo_600}}"
    text: "{{white}}"
    border_radius: "{{radius_lg}}"
    hover: "{{indigo_700}}"

  recommended_for:
    - api_documentation_promos
    - developer_tools_ads
    - technical_webinars
    - integration_announcements

Creative Clay¶

Distinctive creativity for memorable campaigns.

variant_banner_styling_creative_clay:
  primary_color: "{{slate_900}}"          # #0f172a
  secondary_color: "{{slate_700}}"        # #334155
  background: "{{cool_white}}"            # #f8fafc
  text_primary: "{{slate_900}}"           # #0f172a
  text_inverse: "{{white}}"               # #ffffff
  accent: "{{orange_500}}"                # #f97316
  accent_secondary: "{{amber_500}}"       # #f59e0b
  accent_cool: "{{sbk_sky}}"              # #0ea5e9

  frame_style: "frame_solid"
  frame_opacity: 0.1
  grid_system: "editorial_grid"
  corner_radius: "{{radius_2xl}}"         # 16px

  gradient: "multi-stop"
  texture: "noise-grain"
  texture_opacity: 0.015
  blob_shapes: true

  cta_style:
    background: "{{slate_900}}"
    text: "{{white}}"
    border_radius: "{{radius_full}}"      # Pill shape
    hover: "{{slate_800}}"

  special_elements:
    blob_backgrounds: true
    gradient_text: true
    floating_elements: true

  recommended_for:
    - brand_awareness_campaigns
    - creative_announcements
    - thought_leadership
    - friendly_retargeting

frame_recommendations:
  # Social Media Banners
  linkedin_company_banner:
    recommended: ["frame_solid", "frame_dotted"]
    avoid: ["frame_glow", "frame_double"]
    notes: "Professional platforms require subtle framing"

  linkedin_personal_banner:
    recommended: ["frame_solid"]
    avoid: ["frame_glow", "frame_gradient"]
    notes: "Minimal framing to not overpower personal brand"

  twitter_header:
    recommended: ["frame_solid", "frame_dashed"]
    avoid: ["frame_double"]
    notes: "Dynamic platform allows slightly more expression"

  # Email Banners
  newsletter_header:
    recommended: ["frame_solid"]
    avoid: ["frame_glow", "frame_gradient"]
    notes: "Email rendering requires simple borders"

  campaign_email_header:
    recommended: ["frame_solid", "frame_dashed"]
    avoid: ["frame_glow"]
    notes: "Campaign urgency can use dashed for dynamism"

  email_signature:
    recommended: ["none", "frame_solid"]
    avoid: ["frame_double", "frame_glow", "frame_gradient"]
    notes: "Ultra-minimal, nearly invisible"

  # Advertising Banners
  display_leaderboard:
    recommended: ["frame_solid", "frame_gradient"]
    avoid: ["frame_dotted"]
    notes: "High visibility requires bold framing"

  display_medium_rectangle:
    recommended: ["frame_solid", "frame_gradient"]
    avoid: ["frame_dotted"]
    notes: "Prominent ads benefit from clear edges"

  display_skyscraper:
    recommended: ["frame_solid"]
    avoid: ["frame_double"]
    notes: "Vertical format needs contained edges"

  mobile_banner:
    recommended: ["frame_solid"]
    avoid: ["frame_double", "frame_glow"]
    notes: "Small format requires maximum clarity"

  # Event Banners
  webinar_banner:
    recommended: ["frame_solid", "frame_double"]
    avoid: ["frame_glow"]
    notes: "Professional event framing"

  conference_booth:
    recommended: ["frame_solid", "frame_double"]
    avoid: ["frame_dotted", "frame_dashed"]
    notes: "Large format needs bold, clear edges"

  # Retargeting Banners
  retarget_awareness:
    recommended: ["frame_solid"]
    avoid: ["frame_glow"]
    notes: "Soft reminder, not aggressive"

  retarget_action:
    recommended: ["frame_solid", "frame_gradient"]
    avoid: ["frame_dotted"]
    notes: "Stronger CTA framing acceptable"

Grid System Integration¶

grid_integration:
  # Grid System by Banner Category
  social_banners:
    default_grid: "subtle_grid"
    alt_grids: ["minimal_grid"]
    column_system: "columns_12"
    safe_zone_handling: "grid-aware"

  email_banners:
    default_grid: "minimal_grid"
    alt_grids: ["subtle_grid"]
    column_system: "columns_6"
    safe_zone_handling: "centered"

  display_ads:
    default_grid: "structured_grid"
    alt_grids: ["minimal_grid", "subtle_grid"]
    column_system: "columns_3"
    zone_layout: "left-center-right"

  event_banners:
    default_grid: "editorial_grid"
    alt_grids: ["structured_grid"]
    column_system: "columns_12"
    zone_layout: "header-body-footer"

  retargeting:
    default_grid: "minimal_grid"
    alt_grids: ["subtle_grid"]
    column_system: "columns_3"
    focus: "single-message"

  # Grid Token Reference
  gap_scale:
    compact: "{{gap_xs}}"                 # 0.5rem
    default: "{{gap_sm}}"                 # 1rem
    spacious: "{{gap_md}}"                # 1.5rem

  margin_scale:
    tight: "{{space_2}}"                  # 0.5rem
    default: "{{space_4}}"                # 1rem
    relaxed: "{{space_6}}"                # 1.5rem

SBK banners must: - Stop the scroll without being obnoxious - Communicate instantly the value proposition - Maintain brand recognition across platforms - Drive action with clear purpose - Respect the active variant styling parameters

[SBK BRAND DNA]
Professional technology consulting aesthetic. Trustworthy, expert, understated.

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[GRID: {{GRID_STYLE}}]
{{grid_description}}
Frame style: {{FRAME_TYPE}} at {{frame_opacity}} opacity.

[ASSET: LINKEDIN BANNER]
LinkedIn company page cover image.

[SPECIFICATIONS]
1584x396px.
Safe zone: Avoid left 200px (profile overlap).
Mobile: Center focus.

[SUBJECT]
Abstract geometric composition using {{primary_color}} and {{secondary_color}}.
{{gradient_style}} from primary to secondary.
Clean negative space for potential text overlay.
Professional, established, {{variant_mood_keywords}} feel.
Optional: Subtle "SBK Consulting" wordmark right-side.
Corner radius: {{corner_radius}}.
Texture: {{texture}} at {{texture_opacity}} opacity.

[AVOID]
Stock photos. Busy patterns. Full-bleed imagery.
Text that will be cut off on mobile.
{{variant_anti_patterns}}

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[ASSET: LINKEDIN PERSONAL BANNER]
Personal profile banner for SBK team members.

[SPECIFICATIONS]
1128x191px.
Profile photo overlap left-center.

[SUBJECT]
Simpler version of company banner using {{primary_color}}.
Abstract geometric, professional using {{variant_visual_style}}.
Reinforces SBK brand for team members.
Subtle enough to not overpower personal profile.
Frame style: {{FRAME_TYPE}} at reduced {{frame_opacity_reduced}} opacity.

Twitter/X Header¶

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[ASSET: TWITTER HEADER]
Twitter/X profile header image.

[SPECIFICATIONS]
1500x500px.
Account for buttons and content overlap.

[SUBJECT]
Wider panoramic composition in {{primary_color}} and {{accent_color}}.
Abstract {{variant_texture}} with subtle motion feel.
More dynamic than LinkedIn (platform culture).
Still professional, not trendy.
Grid: {{GRID_STYLE}} with horizontal emphasis.

Email Banners¶

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[ASSET: EMAIL NEWSLETTER HEADER]
Header for email newsletters.

[SPECIFICATIONS]
600x200px max.
Under 100KB file size.
Works on {{background_color}} email body.

[SUBJECT]
Clean horizontal banner.
SBK logo left or centered.
Subtle brand pattern using {{primary_color}} or {{gradient_style}}.
Tagline or newsletter name possible.
Simple, fast-loading.
Frame: {{FRAME_TYPE}} or none for email compatibility.

[AVOID]
Complex gradients (email rendering issues).
Dark backgrounds (can cause contrast issues).
{{frame_glow}} effects (not supported in email).

Campaign Email Header¶

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[ASSET: EMAIL CAMPAIGN HEADER]
Header for specific campaign emails.

[SPECIFICATIONS]
600x150px.
Under 80KB file size.

[SUBJECT]
Campaign-specific but brand-aligned using {{primary_color}}.
May include campaign headline in {{text_primary}}.
Clear CTA zone below.
Compelling but professional using {{variant_mood_keywords}}.
CTA styling: {{cta_style}}.

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[ASSET: EMAIL SIGNATURE BANNER]
Small banner for email signatures.

[SPECIFICATIONS]
600x100px or 400x80px.
Under 50KB.
Simple, not distracting.

[SUBJECT]
Ultra-simple brand element using {{primary_color}}.
Logo + tagline or logo + contact.
Nearly invisible as banner—just brand reinforcement.
Background: {{background_color}} or transparent.
Frame: none (email signatures should be frameless).

Advertising Banners¶

Display Ad: Leaderboard¶

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[GRID: structured_grid]
Three-zone horizontal layout.

[ASSET: AD LEADERBOARD]
Standard leaderboard display ad.

[SPECIFICATIONS]
728x90px.
High contrast for visibility.
Clear CTA button.

[SUBJECT]
Concise message + brand + CTA.
{{primary_color}} or {{secondary_color}} background for standout.
{{text_inverse}} text for readability.
Logo small but present.
Single focused message.
Frame: {{FRAME_TYPE}} with {{frame_opacity}} opacity.

[COPY ZONES]
- Left: Logo or icon ({{space_4}} padding)
- Center: Headline (5-7 words max)
- Right: CTA button ({{cta_style}})

[AVOID]
Multiple messages. Busy backgrounds.
Small text. Missing CTA.
{{variant_anti_patterns}}

Display Ad: Medium Rectangle¶

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[GRID: structured_grid]
Three-zone vertical layout.

[ASSET: AD MEDIUM RECTANGLE]
Standard medium rectangle display ad.

[SPECIFICATIONS]
300x250px.
Most common display size.

[SUBJECT]
Vertical layout possibility using {{GRID_STYLE}}.
More room for message than leaderboard.
Still focused and simple.
Clear visual hierarchy with {{typography_heading_weight}} headings.
Corner radius: {{corner_radius}}.

[COPY ZONES]
- Top: Headline or logo ({{space_3}} margin)
- Middle: Supporting copy or visual
- Bottom: CTA button ({{cta_style}})

[AVOID]
Wall of text. Multiple CTAs.
Illegible on mobile.

Display Ad: Skyscraper¶

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[ASSET: AD SKYSCRAPER]
Vertical skyscraper display ad.

[SPECIFICATIONS]
160x600px.

[SUBJECT]
Vertical storytelling format using {{primary_color}} to {{secondary_color}}.
Can include more elements than horizontal.
Still clean and uncluttered per {{variant_mood_keywords}}.
Progression from top to bottom.
Frame: {{FRAME_TYPE}} containing vertical flow.

[AVOID]
Too many text blocks. Horizontal content.
Elements that don't work vertically.

Display Ad: Mobile¶

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[ASSET: AD MOBILE]
Mobile-specific banner sizes.

[SPECIFICATIONS]
320x50px (mobile banner).
320x100px (large mobile banner).
300x50px (alternative).

[SUBJECT]
Ultra-simplified message using {{primary_color}}.
Logo + headline + CTA only.
Finger-tap friendly CTA (min 44px touch target).
Highest contrast for small size: {{text_inverse}} on {{primary_color}}.
Corner radius: {{radius_md}} (smaller for mobile).

[AVOID]
Any unnecessary elements.
Small text. Complex visuals.
{{frame_glow}} or {{frame_gradient}} (too complex for size).

Event Banners¶

Webinar Promotion¶

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[GRID: editorial_grid]
Header-body-footer structure.

[ASSET: WEBINAR BANNER]
Promotional banner for webinar events.

[SPECIFICATIONS]
1920x1080px (presentation).
1200x628px (social share).

[SUBJECT]
Event-focused composition using {{primary_color}} and {{accent_color}}.
Webinar title prominent in {{typography_heading_font}} at {{weight_bold}}.
Date/time visible in {{text_secondary}}.
Speaker photos if relevant.
Registration CTA clear using {{cta_style}}.
Frame: {{FRAME_TYPE}} with {{frame_opacity}} opacity.

[COPY ZONES]
- Top: SBK logo + event type ({{space_4}} padding)
- Center: Webinar title ({{text_4xl}} size)
- Bottom: Date, time, CTA

Conference Booth¶

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[ASSET: CONFERENCE BANNER]
Trade show or conference booth graphics.

[SPECIFICATIONS]
Various: 24"x36", 33"x78" (retractable).
300dpi for print.

[SUBJECT]
Large format, viewed from distance.
Bold brand presence using {{primary_color}} and {{secondary_color}}.
Key message readable at 10+ feet in {{typography_heading_font}}.
Supporting detail for close viewing.
Frame: {{frame_double}} or {{frame_solid}} for premium presence.
Corner radius: {{radius_none}} for print (sharp corners).

[AVOID]
Small text. Complex diagrams.
Photograph-dependent designs.

Retargeting Banners¶

Awareness Retarget¶

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[ASSET: RETARGET AWARENESS]
Retargeting ad for site visitors.

[SUBJECT]
Brand reinforcement focus using {{primary_color}}.
Softer sell than cold ads—{{variant_mood_keywords}} tone.
Remind of value proposition.
Familiar visual from website using {{background_color}} and {{gradient_style}}.
Frame: {{FRAME_TYPE}} subtle at {{frame_opacity_reduced}} opacity.

Action Retarget¶

[STYLE: {{ACTIVE_VARIANT}}]
{{variant_prompt_prefix}}

[ASSET: RETARGET ACTION]
Retargeting ad for engaged visitors.

[SUBJECT]
Stronger CTA focus using {{cta_style}}.
Specific offer or next step.
Urgency appropriate for retarget.
Clear benefit statement in {{text_primary}}.
Accent color {{accent_color}} for CTA emphasis.
Frame: {{FRAME_TYPE}} with standard {{frame_opacity}} opacity.

Variant Recommendations by Use Case¶

variant_recommendations:
  # High-Attention Required
  attention_grabbing:
    primary: "bold_challenger"
    secondary: "creative_clay"
    use_when:
      - "competitive differentiation needed"
      - "product launches"
      - "sales promotions"
      - "breaking through noise"
    avoid_when:
      - "compliance-focused messaging"
      - "established client communication"

  # Professional/Trust Building
  professional_credibility:
    primary: "trusted_advisor"
    secondary: "clean_developer"
    use_when:
      - "enterprise prospects"
      - "compliance content"
      - "thought leadership"
      - "LinkedIn presence"
    avoid_when:
      - "startup audiences"
      - "creative campaigns"

  # Friendly/Approachable
  friendly_messaging:
    primary: "creative_clay"
    secondary: "modern_partner"
    use_when:
      - "community building"
      - "customer success stories"
      - "partnership announcements"
      - "softer retargeting"
    avoid_when:
      - "security urgency"
      - "enterprise formality"

  # Security/Threat Focused
  security_messaging:
    primary: "cyber_shield"
    secondary: "sentinel_guard"
    use_when:
      - "security service promotion"
      - "threat awareness campaigns"
      - "compliance urgency"
      - "penetration testing"
    avoid_when:
      - "general brand awareness"
      - "partnership content"

  # Technical/Developer
  technical_messaging:
    primary: "clean_developer"
    secondary: "sentinel_guard"
    use_when:
      - "API/integration promos"
      - "technical webinars"
      - "developer documentation"
      - "cloud services"
    avoid_when:
      - "C-suite messaging"
      - "compliance-focused"

Platform-Specific Considerations¶

LinkedIn¶

Professional, conservative styling
Longer copy acceptable
Business outcomes focus
Recommended variants: trusted_advisor, clean_developer

Facebook/Meta¶

Slightly warmer tone allowed
Visual-first, copy-second
Mobile-dominant viewing
Recommended variants: modern_partner, creative_clay

Google Display¶

High contrast essential
Animation possible (subtle)
Clear CTA required
Recommended variants: bold_challenger, trusted_advisor

Twitter/X¶

Can be more dynamic
Short, punchy copy
Trending topic alignment possible
Recommended variants: bold_challenger, creative_clay

Quality Checklist¶

Before using any banner:

Technical - [ ] Correct dimensions for platform - [ ] File size optimized - [ ] Corner radius matches {{corner_radius}}

Brand & Variant - [ ] Uses active variant color palette - [ ] Frame style matches {{FRAME_TYPE}} - [ ] Grid system applied: {{GRID_STYLE}} - [ ] CTA styled per {{cta_style}}

Functional - [ ] CTA visible and clear - [ ] Brand recognition maintained - [ ] Message communicates in 2 seconds - [ ] Works on target background - [ ] Mobile-friendly (if applicable) - [ ] Accessibility contrast met (WCAG AA)

Anti-Pattern Check - [ ] No {{variant_anti_patterns}} present - [ ] Doesn't feel like stock imagery - [ ] Maintains SBK distinction

Last Updated: February 2026 Version: 2.0 (Parameterized Design System Integration)

Banner Generation Prompts¶

Design System Configuration¶

Variant-Specific Banner Styling¶

Trusted Advisor (Default)¶

Modern Partner¶

Bold Challenger¶

Cyber Shield¶

Sentinel Guard¶

Clean Developer¶

Creative Clay¶

Frame Style Recommendations by Banner Type¶

Grid System Integration¶

Banner Philosophy¶

LinkedIn Company Banner¶

LinkedIn Personal Banner (For Team)¶

Twitter/X Header¶

Email Banners¶

Campaign Email Header¶

Email Signature Banner¶

Advertising Banners¶

Display Ad: Leaderboard¶

Display Ad: Medium Rectangle¶

Display Ad: Skyscraper¶

Display Ad: Mobile¶

Event Banners¶

Webinar Promotion¶

Conference Booth¶

Retargeting Banners¶

Awareness Retarget¶

Action Retarget¶

Variant Recommendations by Use Case¶

Platform-Specific Considerations¶

LinkedIn¶

Facebook/Meta¶

Google Display¶

Twitter/X¶

Quality Checklist¶

Banner Generation Prompts¶

Design System Configuration¶

Variant-Specific Banner Styling¶

Trusted Advisor (Default)¶

Modern Partner¶

Bold Challenger¶

Cyber Shield¶

Sentinel Guard¶

Clean Developer¶

Creative Clay¶

Frame Style Recommendations by Banner Type¶

Grid System Integration¶

Banner Philosophy¶

Social Media Banners¶

LinkedIn Company Banner¶

LinkedIn Personal Banner (For Team)¶

Twitter/X Header¶

Email Banners¶

Newsletter Header¶

Campaign Email Header¶

Email Signature Banner¶

Advertising Banners¶

Display Ad: Leaderboard¶

Display Ad: Medium Rectangle¶

Display Ad: Skyscraper¶

Display Ad: Mobile¶

Event Banners¶

Webinar Promotion¶

Conference Booth¶

Retargeting Banners¶

Awareness Retarget¶

Action Retarget¶

Variant Recommendations by Use Case¶

Platform-Specific Considerations¶

LinkedIn¶

Facebook/Meta¶

Google Display¶

Twitter/X¶

Quality Checklist¶