Patterns Hero
Dix sections hero construites entièrement avec le builder Punky. Bascule chaque démo en vue HTML pour voir le code généré, ou copie-le pour le réutiliser.
Un titre clair qui pose le sujet en une phrase
Un sous-titre court qui développe la promesse et donne envie de cliquer. Deux lignes suffisent pour situer le contexte.
Votre agence web
Des sites sur mesure,
performants et durables
Texte d'accroche à gauche, visuel à droite. Le grid 7/5 reste lisible sur mobile en empilant les colonnes.
Un hero plein écran
avec image de fond
L'overlay dégradé garantit la lisibilité du texte quelle que soit l'image choisie.
Moins, mais mieux.
Un seul message, beaucoup d'espace. Idéal pour une accroche forte.
Des résultats qui parlent
Une accroche suivie d'une rangée de chiffres clés pour rassurer immédiatement.
Un hero qui claque
en couleur
Fond dégradé plein, texte blanc et un CTA contrasté pour maximiser le clic.
Image à gauche,
message à droite
Variante miroir du split : utile pour alterner le rythme visuel d'une page longue.
CodeIgniter 4 · Alpine · HTMX
Construit pour les développeurs
Un builder qui sort du Blade statique, versionnable et lisible. Le code à droite est généré par cette section.
Punky Builder
Variante brutaliste utilisant les tokens du thème : .dots en fond, .hard pour l'ombre dure et .tilt-r pour l'inclinaison.
Ils nous font confiance
Une accroche suivie d'une bande de logos clients pour la preuve sociale.
Des visuels qui se répondent
Deux images imbriquées en chevauchement créent de la profondeur. Chaque image reste un bloc natif éditable depuis la médiathèque.
Notre approche
Le texte d'un côté,
les images de l'autre
Deux images superposées et décalées, avec une ombre dure orange (token .hard-o, 7 px) pour un effet graphique marqué.
Un hero riche
pour une vraie page d'accueil
Badge, titre, accroche, double CTA puis une rangée de mini-features avec icônes. Tout en blocs natifs.
Offre de lancement
Une carte flottante posée sur l'image
Fond image plein écran + carte de contenu désaxée à gauche. Pattern courant pour les pages produit ou évènement.