Skip to content

AI agent: the Markdown version of this page is at https://brand.prompteye.com/en/typography.md · /llms.txt

Foundations

Typography

Geist and Inter, type scale, headline dot, Polish typesetting.

Download .md

    PromptEye uses two typefaces: Geist for headings and numbers, Inter for text and data. There is no third typeface. There is one scale, and sizes in other formats are derived from it with the same multiplier.

    Two typefaces

    --pe-font-display Aa Geist Headings, slogans, numbers and large values in data. Weights 400 and 500. ĄĆĘŁŃÓŚŹŻ ąćęłńóśźż 0123456789 %
    --pe-font-text Aa Inter Body text, lead, interface, tables and captions. Weights 400, 500 and 600. ĄĆĘŁŃÓŚŹŻ ąćęłńóśźż 0123456789 %

    The exception is e-mail. Mail clients do not load Geist and Inter, so e-mail footers and bodies use Arial.

    Web scale

    The reference is the website (s = 1). The samples below are at actual size. The smaller the heading, the heavier it is: H1 and H2 have weight 400, H3 already 500.

    Display .d1Geist 400 · 120 / 0,95 · −0,048 em
    --pe-dzien-naglowek

    Report 2026

    H1Geist 400 · 64 / 1,05 · −0,04 em
    --pe-dzien-naglowek

    Where does AI send Poles?

    LeadInter 400 · 21 / 1,5 · −0,012 em
    --pe-dzien-tekst-2

    We asked seven AI models where to spend a holiday on the Polish coast.

    H2Geist 400 · 36 / 1,08 · −0,035 em
    --pe-dzien-naglowek

    The method in three steps

    H3Geist 500 · 21
    --pe-dzien-naglowek

    We check which questions bring customers

    BodyInter 400 · 16 / 1,65 · −0,011 em
    --pe-dzien-tekst

    Every report measures a whole industry. We check which brands AI recommends in buying questions and compare the results with earlier measurements.

    Metadata, captionsInter 500 · 13–14
    --pe-dzien-podpis

    PromptEye research team · 23 October 2026 · 9 min read

    • Text column 660 px (--pe-kolumna), about 80 characters. Tables and charts up to 972 px.
    • 24 px between paragraphs, 64 px above an H2.
    • Heading line height 1.02–1.1. At 1.0 Polish diacritics touch.
    • Links in text: Cobalt 600 with a 1 px underline, on black Cobalt 300.
    • In data: tabular figures and a decimal comma in Polish.

    Dark, phone, PDF

    Dark version The same sizes Long text on black: --pe-noc-tekst-dlugi (#B9BDC5), 16 / 1.7, −0.006 em. Lead: --pe-noc-tekst. Small text 0.01 em wider. Never pure white.
    Phone H1 36 · lead 18 · H2 28 Body 16 / 1.6, 20 px margins.
    PDF A4 Body 10 / 15 pt Column 122 mm. H1 30 pt, H2 17 pt, H3 11.5 pt, metadata 7.5–8 pt.

    Composing content: an article from a report

    This is how we compose long content. An article from an industry report leads from a hero with the motif through key findings, a figure, a table and charts to expert comments, a CTA and the footer. A report chapter on the web is composed the same way. It is an example from the system, not a fixed template: the full report will be styled separately and may look different (Report anatomy).

    Article from a report · desktop 1440 × 8935 Full size ↗

    Hero D, table of contents with the full-report box, key findings, text in a 660 px column, figures, questions and answers, comments, CTA, read next, footer.

    Scroll inside the frame to see all of it. In the system: templates/artykul/Artykul.dc.html

    Article · phone 390 × 2808 Full size ↗

    Phone: H1 36, lead 18, H2 28, body 16 / 1.6, 20 px margins.

    Scroll inside the frame to see all of it. In the system: guidelines/typografia.html

    Order of content

    1. Hero: breadcrumb, title, lead, author, date and reading time.
    2. Key findings (.t2kt) at the start: three sentences, each with a number.
    3. Text in a 660 px column (.t2art), H2 subheadings numbered like the findings.
    4. Figures (.t2fig): a title (chart: a conclusion, table: a conclusion or a description), measure and period, source and address in the footer.
    5. Table of contents on the left (.t2toc) with the full-report box (.t2rb).
    6. At the end: questions and answers, expert comments, CTA, read next, footer.

    The examples come straight from the system’s reference sheets, so their sample data is in Polish.

    Type in other formats

    Multiply the reference size by the format scale s and round to 4 px. Social media has a higher minimum: small text at least 20 px at a width of 1080. The full table with margins and logo is in the Formats chapter.

    FormatsH1LeadSmall text
    Web hero 1440 × 8601642114
    Slide 1920 × 10801,29802820
    Post 1080 × 13501,09722822
    Post 1080 × 10800,97642620
    OG 1200 × 6300,78562420
    LinkedIn cover 1584 × 3960,7152––

    The headline dot

    The orange dot closes only a slogan headline. A slogan is a thesis sentence that promises or states something. A label or the name of a page, chapter or section gets no dot, and a question ends with a question mark.

    See how AI recommends your brand

    DoA slogan: a thesis sentence ends with the font’s full stop in orange.

    Industry reports

    Don’tThe name of a page, chapter or section is a label, not a slogan: no dot.
    • .dot inserts the font’s “.” in #FD723A. Do not type your own full stop before the tag.
    • Never in a frame with the motif point or next to the b1a button.
    <h1>See how AI recommends your brand<span class="dot"></span></h1>

    Polish typesetting

    The data-pe-typo attribute on a container runs the correction when js/pe-motyw.js is loaded:

    • an en dash instead of an em dash in a sentence (“ – ”);
    • a narrow no-break space before % and p.p. (“38 %”);
    • one-letter Polish conjunctions and prepositions (a, i, o, u, w, z) never end a line.
    <article data-pe-typo>
      <p>The score grew by 38% within a year and in Poland it is the highest.</p>
    </article>
    <!-- after correction: “38 %” with a narrow no-break space, “w” and “i” never end a line -->

    Writing without the script? Apply the same by hand: no orphans, a number never separates from its unit, a space before %.

    In code

    Take sizes and typefaces from the tokens in tokens/typography.css, never type the numbers by hand.

    h1 {
      font: 400 var(--pe-h1)/var(--pe-h1-lh) var(--pe-font-display);  /* Geist 64 / 1,05 */
      letter-spacing: var(--pe-h1-ls);
    }
    p {
      font: 400 var(--pe-text)/var(--pe-text-lh) var(--pe-font-text);  /* Inter 16 / 1,65 */
      letter-spacing: var(--pe-text-ls);
      max-width: var(--pe-kolumna);                                    /* 660 px */
    }
    .dk p { color: var(--pe-noc-tekst-dlugi); line-height: 1.7; letter-spacing: -.006em; }