Generates and audits UI designs that avoid recognizable AI-generated patterns.
npx skills add https://github.com/ssttkkl/finance-tracker --skill hallmark-ssttkkl
Please help me install this Agent Skill. Skill: hallmark Source: https://github.com/ssttkkl/finance-tracker/tree/main/.agents/skills/hallmark Command: npx skills add https://github.com/ssttkkl/finance-tracker --skill hallmark-ssttkkl
hallmark audit scores an existing page against a named anti-pattern list and returns a ranked punch list; hallmark redesign rebuilds visual structure inside existing implementation boundaries; hallmark study extracts design DNA from a screenshot or URL into a diagnosis or portable design.md. - Component-scope mode: Detects single-element briefs (button, card, modal) and emits the component plus an 8-state demo wrapper covering default, hover, focus, active, disabled, loading, error, and success states. - Use Case: Ask the assistant to build a landing page for a SaaS product; Hallmark runs a pre-flight scan of the existing project, asks for audience/use case/tone, picks a non-repeating macrostructure and theme, and emits token-locked, mobile-verified CSS with a stamped critique score. ## Quick Start Ask the assistant to design a landing page for your product and let Hallmark guide the genre, theme, and macrostructure choices.High-intent search queries and answers about installing and using this skill.
Invoke Hallmark before building: it runs a pre-flight scan of your project, asks for audience, use case, and tone, then picks a named macrostructure and theme from its catalog. Diversification rules prevent it from repeating the same structure across pages.
Run `hallmark audit <target>` on the page or file. It scores the target against a named anti-pattern list — purple-gradient heroes, 3-column feature grids, italic headers, re-drawn browser chrome — and returns a ranked punch list without editing anything.
Yes. `hallmark redesign` preserves routes, component ownership, copy intent, and information architecture, replacing only the visual and interaction layer. It states the exact files it will modify beforehand and requires explicit confirmation for any deletions.
Yes. The pre-flight scan detects frameworks (Next.js, Astro, Vue, Svelte, vanilla), Tailwind configs, font stacks, and existing design tokens, then preserves them. Components consume tokens by name rather than inlining color values.
Use `hallmark study <screenshot or URL>`. It extracts macrostructure, type pairing, and color anchors into a diagnosis report, and can optionally emit a portable design.md. URL mode reads HTML and CSS directly but refuses template-marketplace sources.
When the brief names a single UI element like a button, card, or modal. Hallmark detects component-scope signals and switches to a lighter flow that emits the component plus an 8-state demo wrapper, skipping page-level macrostructure and theme rotation.
fauzanazzGenerates production-grade frontend interfaces with distinctive typography, color, and layout design.
andre-brandaoBuilds a feature's frontend vertical in the real app backed by an in-memory mock namespace.
Yoodaddy0311Automates E2E browser testing, visual regression, and performance measurement with Playwright MCP.
alexgorbatchevStandardize shadcn/ui component adoption and governance across frontend projects.