AI Prompt Template for On-Brand Charts & Data Visuals

Generate structured text specifications, charting rules, color token mappings, and typography guidelines to style on-brand data visuals with AI.

Brand DesignData VisualizationChart DesignBrand IdentityDesign Systems

Objective: Create a reusable AI prompt for language models that generates structured charting rules, visual hierarchy guidelines, and brand styling specifications (color token mapping, typography, axis treatments, gridlines, and legend placements) to ensure quantitative data visuals align with brand guidelines.

How the Base Prompt Was Formed

The base prompt was formed through these deliberate steps:

  • Defined the core analytical narrative ({{data_story}}) so the language model recommends a chart structure that accurately serves the data communication goal before aesthetics are applied.
  • Bound chart elements directly to brand color tokens: mapped primary, secondary, and accent colors ({{primary_color}}, {{secondary_color}}, {{accent_color}}) to data series, baselines, and callouts.
  • Enforced typographic standards by specifying the approved brand body typeface ({{body_font}}) for ticks, axis titles, and data labels.
  • Mandated functional layout rules: explicitly instructed the model to output text specifications for axis treatments, gridline subtlety (opacity/weight), and legend orientation to maintain high data-ink ratios.
  • Kept the prompt strictly structured as a text-generation instruction, producing styling parameters and rules rather than attempting raster image rendering.
Note

Language models excel at text-based reasoning about chart logic, accessibility, and visual hierarchies. Use this prompt to generate complete design specifications and styling tokens, then implement the rules inside charting libraries (e.g., Recharts, Chart.js, Vega-Lite) or presentation tools.

Base Prompt Template

Prompt Template
Recommend a chart type and styling rules for showing {{data_story}} in {{brand_name}}'s brand style. Use the brand color palette ({{primary_color}}, {{secondary_color}}, {{accent_color}}) and {{body_font}} for labels. Specify axis treatment, gridline visibility, and legend placement.

Snippets and Variables

ElementTypeExample ValueDescription
{{data_story}}variablemonthly subscription growth over the past yearThe metric, trend, comparison, or insight being conveyed
{{brand_name}}variableBock CoffeeThe name of the brand or company
{{primary_color}}variable#6B4226Core brand color used for primary data series
{{secondary_color}}variable#C98A4BSecondary color for baseline or comparison series
{{accent_color}}variable#E8734AHighlight color for peak values, callouts, or targets
{{body_font}}variableInterStandard brand body typeface for labels, axes, & legends
Tip

Keep gridlines low-contrast (e.g., subtle 10% opacity neutrals) and reserve your brand's bold accent color exclusively for key insight callouts or milestones.

Filled Base Prompt

Prompt Example
Recommend a chart type and styling rules for showing monthly subscription growth over the past year in Bock Coffee's brand style. Use the brand color palette (#6B4226, #C98A4B, #E8734A) and Inter for labels. Specify axis treatment, gridline visibility, and legend placement.

Extended Example Values

  1. {{data_story}}

    • monthly subscription growth over the past year
    • customer acquisition cost breakdown across 5 marketing channels
    • quarterly net revenue retention compared against industry benchmarks
    • supply chain carbon footprint reduction year-over-year
  2. {{brand_name}}

    • Bock Coffee
    • Apex Biotech
    • FinScale Analytics
    • Terra Energy
  3. {{primary_color}}

    • #6B4226
    • #0F2D59
    • #111827
    • #1B4D3E
  4. {{secondary_color}}

    • #C98A4B
    • #4A90E2
    • #6B7280
    • #74A57F
  5. {{accent_color}}

    • #E8734A
    • #00C49F
    • #6366F1
    • #F59E0B
  6. {{body_font}}

    • Inter
    • Roboto
    • Source Sans 3
    • Plus Jakarta Sans
AI Prompt Template for On-Brand Charts & Data Visuals