How do you make an AI-generated presentation look professional?

Updated: 2026-10-14 · Dawwerni team

Give each slide one idea and a headline that states it, use a fixed 16:9 stage with a clear type scale (titles around 56-72 px, body at least 28 px on a 1920 x 1080 slide), keep text contrast at 4.5:1 or better, align everything to one grid, chart real data with direct labels, then export to PDF or PPTX and check every slide.

Why AI decks look generic

Assistants such as Claude, ChatGPT and Gemini can now write a full HTML presentation in a minute: a title slide, an agenda, a few charts, a closing slide. The result is often impressive at first glance and unconvincing at second glance. The same patterns repeat: every slide carries five bullet points of similar length, gradients and emoji replace a visual idea, charts are filled with plausible-looking invented numbers, and font sizes drift from slide to slide.

None of that is a limitation of the format. HTML is a very good way to build slides, and once the deck is right you can turn it into a file people expect with the free HTML to PowerPoint converter or a PDF. The fix is to give the AI design constraints up front and to review the output against a short checklist. That is what this article provides.

Rule 1: one idea per slide, stated in the headline

The single most effective change is to turn topic titles into message titles. "Q3 revenue" is a topic; "Q3 revenue grew 18% thanks to the new region" is a message (use your real figure). A reader who only reads the headlines should understand the whole presentation. Everything else on the slide exists to support that sentence.

When a slide needs two messages, it is two slides. AI models tend to compress, so ask explicitly for more slides with less on each. A 20-slide deck with one point per slide is easier to present than 8 slides that each need a minute of squinting.

• Headline: a full sentence of 6 to 12 words, stating the takeaway.
• Body: at most 3 short bullets, or one chart, or one image with a caption.
• No paragraph longer than two lines on a slide; move detail to the speaker notes.

Rule 2: a fixed 16:9 stage and a real type scale

A professional deck is designed on a fixed canvas, not a responsive web page. Ask for slides that are exactly 1920 x 1080 pixels (or 1280 x 720), with sizes in px rather than vw, vh or percentages of the window. That way the slide looks the same on your screen, on the projector and after export, and converters can detect each slide reliably. The technical rules are covered in detail in HTML slides to PPTX without losing the design.

Then pick a type scale and keep it. On a 1920 x 1080 slide, these sizes read well from the back of a meeting room and on a laptop:

:root {
  --fs-title: 64px;
  --fs-sub: 36px;
  --fs-body: 30px;
  --fs-small: 22px;
  --gap: 48px;
}
.slide {
  width: 1920px;
  height: 1080px;
  padding: 96px 120px;
  box-sizing: border-box;
  overflow: hidden;
  font-family: "Inter", system-ui, sans-serif;
}
.slide h2 { font-size: var(--fs-title); line-height: 1.1; margin: 0 0 var(--gap); }
.slide p, .slide li { font-size: var(--fs-body); line-height: 1.35; }
.slide .source { font-size: var(--fs-small); opacity: .7; }

Rule 3: contrast, colour and restraint

Projectors wash out colour and many people will read your deck on a phone. Text should meet the WCAG contrast ratio of at least 4.5:1 for normal text and 3:1 for large text; browser DevTools show the ratio when you inspect a text element's colour. Light grey text on white and mid-grey on dark navy are the usual failures in AI output.

Limit the palette to one background, one text colour, one accent and one or two neutrals. Use the accent for one thing per slide: the key number, the highlighted bar, the word that matters. If everything is coloured, nothing stands out. Dark themes look good on screen but cost ink and can turn white when printed; if the deck will become a PDF, read why HTML to PDF looks broken for the print-color-adjust fix.

Rule 4: one grid for every slide

Slides look designed when things line up across slides, not just within one. Choose fixed outer margins (for example 120 px left and right, 96 px top and bottom), a 12-column grid inside them, and a consistent position for the headline. Then a two-column slide, a chart slide and a quote slide will all share the same edges, and flicking between them feels calm.

• Headline always at the same top-left position and width.
• Content blocks snap to 6/6, 4/8 or 4/4/4 column splits.
• Same gap between elements everywhere (one spacing variable, as in the CSS above).
• Logo and page number in the same corner on every slide, or nowhere.
• Images either full-bleed or inside the grid, not floating at random sizes.

Rule 5: charts with real data

This is the rule that matters most for credibility. Language models will happily produce a bar chart with tidy, realistic-looking values that come from nowhere. Always paste your real data into the prompt, or ask for a chart with clearly marked placeholder values that you then replace. Add a source line under every chart.

Good chart design on slides is simpler than in a report: one chart per slide, the headline states what the chart shows, labels sit directly on bars or lines instead of in a separate legend, bars start at zero, and only the series you are talking about gets the accent colour. Turn chart animations off before exporting, or the capture may catch the bars halfway up.

// Chart.js: no animation, direct values, one highlighted bar
new Chart(document.getElementById('sales'), {
  type: 'bar',
  data: {
    labels: ['Q1', 'Q2', 'Q3', 'Q4'],
    datasets: [{
      data: [120, 135, 160, 158],            // replace with your real numbers
      backgroundColor: ['#94a3b8', '#94a3b8', '#2563eb', '#94a3b8']
    }]
  },
  options: {
    animation: false,
    plugins: { legend: { display: false } },
    scales: { y: { beginAtZero: true } }
  }
});

Prompt snippets that get you a better first draft

Put the constraints in the first prompt rather than fixing slides one by one. This works with any assistant that outputs HTML; adapt the wording to your topic.

Create an HTML presentation as a single .html file.
- Each slide is a <section class="slide"> of exactly 1920x1080 px, stacked vertically.
- Sizes in px only (no vw/vh). No animations or transitions.
- Type scale: headline 64px bold, body 30px, small 22px. Font: Inter from Google Fonts.
- Margins 120px left/right, 96px top/bottom; align everything to a 12-column grid.
- One idea per slide. Headline = a full sentence stating the takeaway. Max 3 bullets.
- Palette: white background, #0f172a text, one accent #2563eb. Contrast at least 4.5:1.
- Charts with Chart.js, animation: false, labelled directly, y axis from zero.
- Use ONLY the data I give below; if something is missing write [PLACEHOLDER].
- Speaker notes for each slide in <aside class="notes">.
Data: ...

Follow-up prompts for the second pass

• "Rewrite every headline as a sentence that states the conclusion."
• "Split any slide with more than 3 bullets into two slides."
• "Make all slides use the same headline position and margins."
• "Remove decorative emoji and gradients; use the accent colour only for the key number."
• "Move explanations from the slides into the speaker notes."

Review checklist and export

1. Read only the headlines in order: do they tell the story?
2. Check that the smallest text on any slide is at least 22-24 px at 1920 x 1080.
3. Check every number against your source; delete anything you cannot source.
4. Flick through quickly: do headlines and margins stay in the same place?
5. Export: drop the .html into our HTML to PPTX converter for a PowerPoint file, or into the HTML to PDF tool for a 16:9 PDF.
6. Open the exported file and look at every slide before you send it.

Be clear about what the PowerPoint export is: each slide becomes one full-slide image, pixel-faithful to your design, with speaker notes from aside class="notes" carried into PowerPoint's notes. The text on the slides is not editable, so make final wording changes in the HTML (or ask the AI) before converting. If colleagues need to edit text in PowerPoint, rebuild the key slides there using the exported images as a reference. For a deck made in Claude, the full workflow is in Claude artifact to PowerPoint, and the right page size for sharing as PDF is explained in A4, Letter or 16:9.