AVQN — Punchline

Édite le template puis enregistre avant de lancer l'aperçu.

Slug

Libellé

Plateforme

Largeur (px)

Hauteur (px)

Charte graphique

HTML (body)

CSS

@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@500;800;900&family=Inter:wght@400;500;600&display=swap');
:root{--noir:#000;--encre:#13161B;--blanc:#fff;--ardoise:#5B6472;--brume:#9AA3B0;--filet:#E4E7EC;--magenta:#FF2D78;}
*{margin:0;padding:0;box-sizing:border-box;}
.stage{width:1080px;height:1080px;background-color:var(--noir);background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:44px 44px;display:flex;align-items:center;justify-content:center;padding:110px;font-family:'Inter',sans-serif;}
.inner{max-width:86%;display:flex;flex-direction:column;align-items:center;text-align:center;}
.quote{font-family:'Archivo',sans-serif;font-weight:900;font-size:84px;line-height:1.05;letter-spacing:-.02em;color:var(--blanc);}
.trait{width:80px;height:8px;background:var(--magenta);margin-top:52px;}
.attr{font-weight:600;font-size:22px;text-transform:uppercase;letter-spacing:.18em;color:var(--brume);margin-top:40px;}

Schéma de variables (JSON)

Variables d'exemple (JSON)

Aperçu de rendu

Le rendu utilise les variables d'exemple sauvegardées (via le Chromium partagé). Enregistre d'abord, puis lance l'aperçu — l'image est aussi ajoutée à la galerie.