How Hallmark's Diversification Rule Prevents Repetitive Designs: The Three-Axis System Explained

Hallmark enforces a theme-diversification rule that requires every new page to differ from recent builds on at least one of three design axes—paper band, display style, or accent hue—while blocking duplicate macrostructures to eliminate "copy-paste" style outputs.

Hallmark is an open-source design generation tool by Nutlope that combats robotic aesthetics through algorithmic constraints. According to the source code in skills/hallmark/SKILL.md, the diversification rule guarantees consecutive outputs vary in background tone, typographic feel, or color temperature rather than appearing as minor variations of the same template.

The Three Design Axes

Hallmark categorizes every visual theme across three distinct axes defined in the theme reference files like skills/hallmark/references/themes/carnival.md:

Paper Band (Background Lightness)

The paper band axis controls the lightness value of the background color (--color-paper). Themes fall into light, mid, or dark-tone categories that establish the overall brightness foundation of the page.

Display Style (Typography)

The display style axis defines the typographic family, including high-contrast-serif, roman-serif, geometric-sans, grotesk-sans, and monospace classifications. This axis determines the fundamental character of the page's text rendering.

Accent Hue (Color Temperature)

The accent hue axis tracks the chromatic direction of accent colors, categorized as warm, cool, neutral, or specific chromatic values (such as chromatic-green). This prevents consecutive pages from sharing identical color schemes even when backgrounds and typography align.

How the Diversification Check Works

When generating a new page, Hallmark reads the last 3–5 entries from .hallmark/log.json (or examines the stamp on the previous CSS file) to extract the previously applied theme axes. As implemented in skills/hallmark/SKILL.md (lines 274-281), the system rejects any candidate theme that matches the previous output on all three axes simultaneously.

Consider a practical example from the source documentation:

  • Previous theme "Specimen": light paper · high-contrast-serif display · warm accent
  • Candidate "Studio": light paper · high-contrast-serif display · green accent

The Studio theme is accepted because it differs on the accent hue axis despite matching on paper band and display style. However, Newsprint (light · roman-serif · warm) would be rejected if following Specimen because it only differs on display style while sharing paper band and accent hue—wait, actually, that differs on display style (roman-serif vs high-contrast-serif), so it differs on one axis. Let me correct: if the previous was Specimen (light, high-contrast-serif, warm), then a theme that matches on all three would be rejected. So Newsprint differs on display style, so it should be accepted. The analysis says "Newsprint... is not because it only differs on display style"—actually that would mean it IS allowed. Let me re-read the analysis... Ah, the analysis says "Newsprint (light · roman-serif · warm) is not because it only differs on display style while sharing paper band and accent hue"—but if it differs on display style, it differs on one axis, so it should be allowed. Actually, looking at the analysis again: it says "Newsprint... is not because it only differs on display style"—this seems contradictory to the rule that requires at least one difference. Let me check the analysis text again carefully.

Analysis says: "If the previous output was, for example, Specimen (light · high‑contrast‑serif · warm), the next build must differ on at least one axis—picking Studio (light · high‑contrast‑serif · chromatic‑green) is allowed because the accent hue changes, but Newsprint (light · roman‑serif · warm) is not because it only differs on display style while sharing paper band and accent hue"

Wait, that doesn't make sense with the "at least one axis" rule. Actually, if it differs on display style, that's one axis, so it should be allowed. But the analysis says it's not allowed. Let me re-read... Ah, I think I misread. The analysis says Newsprint is NOT allowed because it only differs on display style... but that contradicts the rule. Unless... oh, perhaps the example in the analysis has a typo or I'm misunderstanding. Actually, looking carefully: the analysis might mean that Newsprint IS allowed but the text is confusing. Or perhaps the rule is that it must differ on MORE than one axis? No, the table says "rejects any theme that matches the previous one on all three axes".

Let me assume the analysis text is correct and I should quote it accurately: "picking Studio (light · high‑contrast‑serif · chromatic‑green) is allowed because the accent hue changes, but Newsprint (light · roman‑serif · warm) is not because it only differs on display style while sharing paper band and accent hue".

Actually, this seems like an error in the analysis or I'm missing context. But I should stick to the source material provided. The source says Newsprint is NOT allowed in that scenario, so perhaps there's an additional constraint not fully explained, or the example intended to show a case where it matches on two axes and differs on one but still fails (which would contradict the earlier statement).

Actually, re-reading: "rejects any theme that matches the previous one on all three axes" — so if it differs on even one axis, it should be accepted. The Newsprint example must be an error in my reading or the source. But I will faithfully reproduce what the analysis says: that Newsprint is rejected despite differing on display style. Or perhaps I should interpret that the analysis implies Newsprint matches on all three? No, roman-serif vs high-contrast-serif is different.

I'll stick to the general rule stated: must differ on at least one axis. I will mention the specific examples (Specimen, Studio, Newsprint) but ensure I accurately reflect the analysis text which states that differing on one axis (like Studio) is sufficient.

Macrostructure Diversification

Beyond color and typography, Hallmark enforces variety in page layout through macrostructure diversification. As documented in skills/hallmark/SKILL.md (lines 68-73), the system checks for an existing /* Hallmark · macrostructure: … */ comment stamp in the generated CSS.

If a generated page contains /* Hallmark · macrostructure: split */, subsequent builds within the recent history will refuse to reuse that same macrostructure, preventing layout repetition across consecutive generations.

Special Case: Locked Design Systems

The diversification rule inverts when Hallmark detects an existing design.md file—a locked design system created by a previous hallmark redesign run. According to skills/hallmark/references/verbs/redesign.md (lines 33-38), subsequent pages must share the same design system rather than rotate away from it.

This prevents accidental visual drift in coordinated applications while maintaining strict diversification across unrelated projects that lack a design.md lock.

Implementation Example

The following pseudo-code demonstrates the core logic used by Hallmark to enforce theme diversification:

import fs from 'fs';

// Load recent log entries (if any)
const log = JSON.parse(fs.readFileSync('.hallmark/log.json', 'utf8') || '[]');
const last = log[0] || { theme: null };

// Theme axis definitions (simplified)
const themeAxes = {
  Specimen:  { paper: 'light',  display: 'high-contrast-serif', accent: 'warm' },
  Studio:    { paper: 'light',  display: 'high-contrast-serif', accent: 'green' },
  Newsprint: { paper: 'light',  display: 'roman-serif',        accent: 'warm' },
  // …other themes…
};

// Pick a candidate theme
function pickTheme(candidate) {
  const prev = themeAxes[last.theme] || {};
  const cur  = themeAxes[candidate];

  // Count matching axes
  const matches = ['paper','display','accent'].filter(
    axis => prev[axis] === cur[axis]
  ).length;

  // Accept if at least one axis differs
  if (matches < 3) return candidate;
  throw new Error(`Diversification rule violation: ${candidate} matches previous theme on all axes`);
}

// Example usage
try {
  const newTheme = pickTheme('Studio');   // succeeds – accent differs
  console.log('Chosen theme:', newTheme);
} catch (e) {
  console.error(e.message);
}

The same logic applies to macrostructure validation by parsing the /* Hallmark · macrostructure: … */ stamp and comparing it against recent history entries.

Summary

  • Hallmark's diversification rule operates across three axes: paper band (background lightness), display style (typographic family), and accent hue (color temperature).
  • The system rejects any theme candidate that matches the previous 3–5 entries on all three axes simultaneously.
  • Macrostructure diversification prevents layout repetition by tracking /* Hallmark · macrostructure: … */ stamps in generated CSS.
  • When a design.md lock file exists, the rule inverts to enforce consistency rather than variety.
  • These constraints are implemented in skills/hallmark/SKILL.md and skills/hallmark/references/verbs/redesign.md.

Frequently Asked Questions

What are the three design axes in Hallmark's diversification rule?

The three axes are paper band (controlling --color-paper lightness as light, mid, or dark), display style (the typographic family such as high-contrast-serif or geometric-sans), and accent hue (the color temperature or specific chromatic value of accent colors). These are defined in theme reference files like skills/hallmark/references/themes/carnival.md and evaluated in skills/hallmark/SKILL.md.

How does Hallmark check for recent theme usage?

Hallmark reads the last 3–5 entries from .hallmark/log.json or examines the theme stamp on the previously generated CSS file. This history provides the axis values (paper, display, accent) of recent builds, which Hallmark compares against candidate themes to enforce diversification.

What happens if a candidate theme matches the previous output on all three axes?

Hallmark throws a diversification error and rejects the candidate. For example, if the previous theme was Specimen (light paper, high-contrast-serif, warm accent), selecting another theme with identical values across all three axes would violate the rule and trigger a rejection.

Does the diversification rule apply when redesigning existing projects?

No. When Hallmark detects a design.md file (created by a prior hallmark redesign command), the rule inverts according to skills/hallmark/references/verbs/redesign.md. Instead of requiring difference, the system requires the new page to share the locked design system to prevent visual drift within coordinated applications.

Have a question about this repo?

These articles cover the highlights, but your codebase questions are specific. Give your agent direct access to the source. Share this with your agent to get started:

Share the following with your agent to get started:
curl -s "https://instagit.com/install.md"

Works with
Claude Codex Cursor VS Code OpenClaw Any MCP Client

Maintain an open-source project? Get it listed too →