En juillet 2026, un projet open-source appelé Nutlope/hallmark a fait un tabac sur GitHub Trending — il a gagné 3 181 étoiles en une seule journée, dépassant rapidement les 10 000+ stars. Ce n'est pas un nouveau modèle IA, pas un framework de programmation, mais un Skill de design anti AI-slop.

Si vous en avez marre des pages web générées par IA qui se ressemblent toutes, Hallmark est fait pour vous.

Qu'est-ce que Hallmark ?

Hallmark est un Skill de design « anti goût IA » open-source, conçu pour les outils de programmation IA comme Claude Code, Cursor et Codex. Il est développé par l'équipe de Together AI et publié sous licence MIT.

Pourquoi les designs générés par IA se ressemblent-ils toujours ?

Tous les grands modèles de langage sont entraînés sur les mêmes données internet, ce qui les amène à converger vers des « valeurs par défaut de distribution » similaires (on-distribution defaults). Résultat :

  • Chaque landing page suit le même schéma : hero + trois colonnes de features + CTA
  • Les palettes de couleurs tournent toujours autour des dégradés + cartes blanches
  • La police est systématiquement Inter / sans-serif
  • Les layouts sont pratiquement identiques

Ce phénomène est appelé « AI slop » — du contenu généré par IA qui semble sortir du même moule.

Comment Hallmark résout ce problème ?

Le mécanisme de Hallmark est plutôt malin :

Mécanisme Description
21 macro-structures Chaque génération sélectionne aléatoirement l'une des 21 layouts, garantissant la diversité
20+ thèmes Distil, Cold Snap, Bubble, Garden, Riso et bien d'autres styles radicalement différents
57 portes de détection de slop Après la génération, 57 anti-patterns de design typiques de l'IA sont détectés automatiquement
Auto-vérification pré-publication Le système s'auto-examine avant de produire le résultat et refuse de sortir si les critères ne sont pas remplis

Le résultat : deux pages générées avec Hallmark ressemblent à deux sites complètement différents, pas à la même template avec des couleurs changées.

Installer Hallmark

Méthode 1 : via npx (recommandé)

Le moyen le plus simple est d'utiliser la commande npx skills add :

BASH
npx skills add nutlope/hallmark

Cette commande télécharge automatiquement les fichiers Skill de Hallmark dans le dossier de configuration de votre outil IA. Relancez-la pour mettre à jour.

Méthode 2 : installation manuelle

Si vous préférez gérer vous-même, il suffit de télécharger SKILL.md et le dossier references/, puis de les placer dans le répertoire approprié :

Claude Code :

BASH
mkdir -p ~/.claude/skills/hallmark/
# Y placer SKILL.md et references/

Cursor :

BASH
# Créer à la racine du projet
mkdir -p .cursor/rules/
# Placer le contenu de SKILL.md (sans le frontmatter) dans .cursor/rules/hallmark.mdc

Codex :

BASH
# Niveau personnel (global)
mkdir -p ~/.codex/skills/hallmark/

# Niveau projet (uniquement le projet actuel)
mkdir -p .codex/skills/hallmark/

Les quatre commandes clés de Hallmark

Hallmark propose quatre commandes puissantes qui couvrent l'ensemble du workflow, de la création à la refonte :

1. hallmark (commande par défaut)

C'est la commande la plus utilisée, pour construire une nouvelle UI de zéro.

TEXT
hallmark

Elle va : - Choisir une macro-structure adaptée à votre besoin - Appliquer un ensemble de règles - Exécuter les 57 tests anti-slop - S'auto-examiner avant de produire le résultat

✅ Résultat : chaque nouvelle page possède sa propre « empreinte de design », sans aucune ressemblance avec une autre

2. hallmark audit <cible>

Pour évaluer du code existant et détecter les anti-patterns AI-slop.

TEXT
hallmark audit src/components/LandingPage.jsx

Elle va : - Analyser le code du fichier ou du répertoire cible - Noter et lister tous les anti-patterns de design IA trouvés - Générer une liste de suggestions de correction - Ne modifie aucun code, purement diagnostique

✅ Résultat : identifiez rapidement ce qui doit être refactoré, sans réécrire à l'aveugle

3. hallmark redesign <cible>

Pour refondre une page existante, en gardant le contenu mais en changeant radicalement l'apparence.

TEXT
hallmark redesign src/pages/Home.jsx

Elle va : - Abandonner la structure existante - Conserver le texte, l'architecture d'information et les éléments de marque - Reconstruire la page entière avec une nouvelle empreinte de design - Vérifier que le nouveau design respecte les standards anti-slop de Hallmark

✅ Résultat : une refonte totale en une passe, tout en préservant la logique métier

4. hallmark study <capture d'écran | URL>

Pour apprendre des bons designs et extraire leur ADN visuel.

TEXT
hallmark study https://example.com/design-inspiration

Elle va : - Analyser la capture d'écran ou l'URL de la page web - Extraire les éléments clés : macro-structure, paires de polices, ancres colorimétriques, etc. - Refuser la copie pixel-par-pixel et les templates payants - Optionnellement générer un fichier design.md portable, utilisable avec d'autres outils IA

✅ Résultat : transformer un design de maître en un système de design réutilisable

Démo pratique : construire une Landing Page de zéro

Créons ensemble la page d'accueil d'un produit SaaS moderne avec Hallmark :

  1. Lancez Claude Code, en vérifiant que le Skill Hallmark est activé
  2. Entrez le prompt : text Utilise hallmark pour construire une landing page pour un produit SaaS appelé "Hyperlane", une plateforme de monitoring Dev Infrastructure, ciblant les ingénieurs, avec un accent sur le temps réel et la fiabilité.
  3. Observez le résultat : - Hallmark a automatiquement sélectionné le thème « Hyperlane » (tiré de ses exemples officiels) - Il a utilisé un layout en grille et une palette de couleurs uniques - Le texte et les éléments visuels sont spécifiquement adaptés aux ingénieurs - Les fichiers HTML/CSS générés contiennent des commentaires indiquant la macro-structure utilisée

C'est toute la magie de Hallmark — fini les templates génériques, place à un design sur mesure pour chaque produit.

La philosophie de design de Hallmark

Hallmark repose sur une philosophie de design profonde :

  • Refus de la template : pas de « thème par défaut », chaque création est originale
  • Cultiver la diversité : 21 macro-structures garantissent qu'aucune structure ne se répète
  • Priorité à la qualité : 57 portes de détection sont plus strictes qu'un designer humain
  • Traçabilité : chaque fichier HTML généré porte des commentaires CSS indiquant son empreinte de design
  • Composabilité : le design.md généré peut être importé dans d'autres outils IA, formant un pipeline de design

Conclusion

Hallmark n'est pas un simple framework CSS, c'est un agent de réflexion design alimenté par l'IA. Il apprend aux outils IA à penser comme des designers humains : comprendre le contexte, respecter la marque, rechercher l'unicité, éviter la médiocrité.

À l'ère où les outils de design IA prolifèrent, Hallmark offre une approche radicalement différente : il ne s'agit pas de faire générer plus de choses plus vite par l'IA, mais de lui faire produire moins, mais mieux.

🚀 Passez à l'action : 1. Visitez le site officiel de Hallmark pour voir tous les exemples 2. Mettez une étoile sur Nutlope/hallmark sur GitHub 3. Lancez npx skills add nutlope/hallmark et commencez votre voyage anti AI-slop


Cet article est basé sur Hallmark v2.1.0. Pour la dernière version, consultez le repository GitHub