Hallmark Is Racing to 12K Stars for a Reason

Hassan El Mghari at Together AI built Hallmark, an anti-AI-slop design skill for Claude Code, Cursor, and Codex that hit 12,200 GitHub stars and became the #1 trending repository on Trendshift. The tool runs 57 deterministic quality gates on AI-generated frontend code, enforcing design quality through verbs like Build, Audit, Redesign, and Study. Its rapid adoption signals a shift from AI coding capability to quality control in the developer ecosystem.

Nutlope/hallmark https://github.com/nutlope/hallmark hit 12,200 GitHub stars this week -- gaining 1,486 in a single day -- and claimed the 1 trending repository spot on Trendshift https://trendshift.io/repositories/33587 on July 15, 2026. It is an anti-AI-slop design skill for Claude Code, Cursor, and Codex built by Hassan El Mghari at Together AI. One command installs it: npx skills add nutlope/hallmark . The star velocity is not hype. It is a demand signal: developers have stopped asking whether AI can write code and started asking who controls the quality of what it ships. Read the full version with charts and embedded sources on AgentConn That shift -- from capability to control -- is the real story. Hallmark is the fastest-growing single artifact in the agent-skill ecosystem not because it does something new, but because it does something developers have been manually patching around for eighteen months: it runs 57 deterministic quality gates on every AI-generated page before that page leaves the build loop. The value in AI coding is migrating from models to the skill and tooling layer on top of them, and it is the open ecosystem -- not the labs -- building it. Hallmark is not a component library. It is an instruction file -- a SKILL.md with a references directory -- that constrains how a coding agent generates frontend output. When you install it, your agent gains four verbs: Build default . Give Hallmark a brief -- "landing page for a developer tool" or "dashboard for a logistics app" -- and it asks three clarifying questions, selects a macrostructure one of 21 named whole-page shapes like Bento Grid, Marquee Hero, Long Document, or Workbench , applies a theme, and generates the page. Before it hands you the output, it runs every line through the 57-gate slop test. Anything that trips a gate gets regenerated. Audit . Point it at an existing page -- hallmark audit src/app/page.tsx -- and it scores your code against the full anti-pattern catalogue without changing a line. You get a punch list of what makes your UI look AI-generated: repeated border-radius values, identical card heights, Inter-at-400-everywhere, purple-gradient-on-dark-background, the full taxonomy of tells. Redesign . This verb throws out the visual structure but preserves your copy, information architecture, and brand. It rebuilds the page with a completely different fingerprint. Two redesigns of the same page look like two different sites, not two themes applied to one template. Study . Paste a screenshot or URL of a site you admire -- hallmark study https://linear.app -- and it extracts the design DNA: macrostructure, typography pairing, color anchor, spacing rhythm. The output is a portable design.md that you can feed into future builds. No pixel-perfect cloning. Design language transfer. The slop test is not a vague checklist. It is 57 specific, deterministic checks organized across six axes -- Philosophy, Hierarchy, Execution, Specificity, Restraint, and Variety. Every gate is binary: pass or regenerate. Here is a sample of what trips the test: ease-in-out on everything is a slop tell. The skill requires spring physics or intentional easing curves, with prefers-reduced-motion always respected.Before the slop test runs, a pre-emit self-critique scores the output 1-5 on each of the six axes. Anything below 3 on any axis triggers a full revision pass before the gates even run. The critique is embedded as a CSS comment in the final output -- you can read it to understand the agent's reasoning. Quick audit command:Run hallmark audit src/ on any existing project to get a slop score without changing a line of code. The output lists every gate that fails with specific remediation steps. The criticism most people level at theming systems -- "they are just color swaps" -- does not apply here because Hallmark themes are not CSS variable packs. Each theme defines a complete design system: typography pairing specific font stacks, not generic categories , color anchor with derived palette, spacing rhythm, motion character, and component treatment defaults. The 22 themes are organized across four genres: Carnival uses grotesque sans-serif with high contrast and bold color blocking. Cobalt uses Space Grotesk with mono-paired technical precision. Hum uses Plus Jakarta Sans for warm humanist roundness. These are not color swaps -- they are fundamentally different design languages. The v1.1 release https://x.com/nutlope/status/2062226108154618268 added the four newest themes Carnival, Lumen, Hum, Cobalt plus more slop detectors and a redesign-mode overhaul. The live showcase at usehallmark.com https://www.usehallmark.com/ lets you press T to cycle through all 22 themes on any page -- proof that the same content renders as genuinely different sites under each theme. Macrostructures are equally important. Hallmark defines 21 named whole-page shapes -- Bento Grid, Marquee Hero, Long Document, Workbench, Asymmetric Split, and sixteen more -- that determine the spatial bones of a page before any content or styling is applied. The agent selects the macrostructure based on the brief's content type, not randomly. A SaaS pricing page gets a different skeleton than a developer documentation portal, which gets a different skeleton than an event landing page. Hassan El Mghari launched Hallmark on May 19, 2026 https://x.com/nutlope/status/2056754959819915459 with a single tweet and a GitHub repo. Within 24 hours, it had 1,000 installs https://x.com/nutlope/status/2057167106718699545 . The growth arc tells a story about demand timing: That trajectory maps directly onto the broader agent-skill explosion https://agentconn.com/blog/agent-skills-new-dotfiles-repos-racing-250k-stars-2026 . When obra/superpowers holds 252K stars and mattpocock/skills holds 165K, the ecosystem is clearly signaling that the skill layer is where practitioners are investing. Hallmark is the design-quality vertical of that wave. Install one command npx skills add nutlope/hallmark The skill lands in ~/.claude/skills/hallmark/ Claude Code auto-discovers it on next session Build a new page Just describe what you want -- hallmark activates automatically: "Build a landing page for a developer analytics tool" Audit an existing page "hallmark audit src/app/page.tsx" Redesign without changing copy "hallmark redesign src/app/landing.tsx" Study a reference site "hallmark study https://linear.app" Install npx skills add nutlope/hallmark Or manually copy to .cursor/rules/hallmark.mdc Cursor reads it as a rule file Same four verbs work in Cursor's composer Install npx skills add nutlope/hallmark Or copy to ~/.codex/skills/hallmark/ or .codex/skills/hallmark/ Codex picks it up from either location Pro tip -- chain audit with CI.Add hallmark audit src/ as a pre-commit hook or CI step. The audit outputs a machine-readable score. Set a threshold no gate failures allowed and block deploys that ship slop. This turns hallmark from a generation-time tool into a continuous quality gate. Before any design work, Hallmark runs a pre-flight scan that checks six sources in your project: Results are stored in .hallmark/preflight.json . This means Hallmark respects your existing design decisions rather than overwriting them. If you already have a color palette defined, it works within that palette. If you have Framer Motion installed, it uses spring physics. The skill adapts to your stack rather than imposing one. The counter-argument worth considering:If frontier models had better taste, you would not need 57 gates to catch slop. Together AI building this is, at some level, an admission that their own models -- and everyone else's -- have a design-quality ceiling that instruction-level prompting cannot fix. The strongest version of the argument: as models improve Claude 5, GPT-5, Gemini 2.5 Pro , the aesthetic floor will rise. The patterns Hallmark catches -- Inter everywhere, purple gradients, identical cards -- are training-data artifacts. Better training data and RLHF on design quality will reduce them. When that happens, 57 gates checking for patterns that no longer appear becomes dead weight in your skill directory. There are two responses to this, and both have merit: First, models improve slower than practitioners need. The slop problem is real today. Teams shipping AI-generated frontends today need a quality gate today. Waiting for models to develop better taste is like waiting for compilers to eliminate the need for linters -- it could happen, but you are shipping code now. Second, the skill layer does something models architecturally cannot: enforce variety. A model's output is a probability distribution. Without constraints, it will always gravitate toward the mode of its training data -- the most common patterns. Hallmark's macrostructure selection and theme system are explicit mechanisms for pushing output away from the mode. Even a model with perfect "taste" would still converge on a narrow set of preferred patterns. The skill layer provides structural diversity that is orthogonal to model quality. The real risk is different: skill proliferation. If every design agency ships their own 57-gate slop test, the ecosystem fragments. Hallmark's MIT license and the study verb which lets you extract design DNA without coupling to the skill suggest Hassan is aware of this. But whether Hallmark becomes the standard or one of twelve competing standards remains an open question -- exactly the same fragmentation risk https://agentconn.com/blog/agent-skills-new-dotfiles-repos-racing-250k-stars-2026 that applies to the broader skill ecosystem. The actionable takeaway is straightforward: If you generate any frontend with an AI coding agent, install Hallmark today. One command, zero configuration. The audit verb alone -- which scores your existing pages without changing them -- is worth the install. Run it against your current codebase and see how many slop tells your agent has been shipping. If you run a team, wire audit into your CI pipeline. The gate-based architecture means you can set a threshold and block deployments that fail. This is the same pattern as ESLint or Prettier -- deterministic quality enforcement at the tool level, not relying on individual discipline. If you are evaluating the agent-skill ecosystem: Hallmark's growth is a signal that the value in AI coding is migrating from the model layer to the harness and tooling layer https://agentconn.com/blog/agent-harness-not-model-guardrail-stack-2026 . The companies and teams that invest in skill curation, quality gates, and output control will outperform those that rely on raw model capability. The security implications https://agentconn.com/blog/agent-config-skills-supply-chain-attack-surface-2026 of running third-party skills are real -- vet what you install -- but the productivity case is proven. The community is voting with stars: 12,200 and counting. The question is no longer whether AI can write your frontend. It is whether your frontend deserves a quality gate. Hallmark says yes. Originally published at AgentConn