Landing page SaaS Beaconv1.0.4
Utilisez ce Skill pour créer une landing page.
Populaire
5.0118 téléchargements1 « j'aime »3 enregistrements
Gratuit
Un site marketing SaaS apaisé aux tons neutres chauds, éclairé par un seul faisceau de lumière bleue douce, avec des titres en dégradé, un Hero centré et discret, et votre produit présenté sous forme de console fonctionnelle en direct plutôt que de capture d'écran. Suivent les fonctionnalités, une visite guidée du produit à onglets, les étapes de mise en place, des témoignages clients, des tarifs mensuels ou annuels avec tableau comparatif, la sécurité et une FAQ, ainsi que des pages d'inscription, de connexion, de contact commercial, de changelog, de statut, de mentions légales et 404. Les thèmes clair et sombre sont tous deux complets, et chaque lien et formulaire fonctionne.
Le plus souvent choisi par
Mis à jour le 3 oct. 2026
Galerie d'aperçus
Skills similaires
Voir tous les Skills
Ce que vous obtenez
- Un site SaaS complet dans un fichier HTML autonome qui s'ouvre hors ligne dans n'importe quel navigateur : la landing page plus les pages d'inscription, de connexion, de contact commercial, de changelog, de statut, de mentions légales et 404
- Une console produit en direct reconstruite avec le vocabulaire de votre produit, avec sélecteur de période, infobulles de graphique, compteurs en direct et chronologie des incidents, plutôt qu'une capture d'écran statique
- Police Geist, un faisceau bleu, des surfaces neutres chaudes, des thèmes clair et sombre complets et des formulaires avec validation, états de chargement et de succès ; dans votre propre projet, le même design dans votre stack
Idéal pour
- Les fondateurs et indie hackers qui ont besoin cette semaine d'un site marketing SaaS crédible avec tarifs, inscription et changelog
- Les outils pour développeurs et les produits de monitoring, d'API et d'infrastructure qui veulent montrer le produit lui-même sous forme d'interface fonctionnelle
- Les responsables marketing produit qui veulent itérer sur le positionnement directement sur une page à l'aspect fini
Pas pour
- Les sites qui ont besoin d'un CMS, d'un blog ou de vrais comptes : les formulaires d'inscription et de contact confirment dans la page, et le branchement d'un back-end vous revient
- Les marques qui doivent suivre un design system existant : les neutres chauds, le faisceau bleu unique et les titres en dégradé sont l'essence du produit
- Les marques grand public ou lifestyle qui misent sur la photographie : les images se limitent à un témoignage client, des avis, une photo éditoriale et une photo d'équipe
Lancement produit et croissance d'appWeb design et expériences numériquesCréer une landing pageStyle verrouilléRésultat modifiableLivraison rapideMinimalisteAccent lumineuxTypographie en dégradéNeutre doux
À propos de ce Skill
Décrivez votre produit et recevez un site marketing SaaS complet : surfaces neutres chaudes, un faisceau de lumière bleue douce, titres en dégradé et votre produit présenté sous forme de console en direct plutôt que de capture d'écran. Il est livré en un fichier autonome qui s'ouvre dans n'importe quel navigateur et fonctionne hors ligne.
Ce que vous obtenez
- Une landing page avec une grille bento de fonctionnalités, une console produit en direct, une visite guidée à onglets, les étapes de mise en place, un témoignage client et des avis, des tarifs avec tableau comparatif, la sécurité, une FAQ et un CTA final
- Des pages d'inscription, de connexion, de contact commercial, de changelog, de statut, de confidentialité, de conditions d'utilisation et 404, toutes reliées et fonctionnelles
- Des thèmes clair et sombre complets, des apparitions discrètes au défilement et des animations qui se désactivent pour les visiteurs préférant les réduire
- Des formulaires qui valident la saisie en ligne et affichent des états de chargement et de succès, plus des filtres et une recherche dans le changelog
- Dans votre propre projet, le même design construit sous forme de composants dans votre stack
Comment l'utiliser
- Indiquez le nom de votre produit, ce qu'il fait, vos forfaits et les clients ou citations que vous pouvez utiliser ; des notes approximatives suffisent
- Laissez-le choisir les sections et les pages, ou nommez celles que vous voulez ; tout ce que vous n'avez pas fourni est rédigé et listé pour que vous le confirmiez
- Ouvrez le fichier final dans votre navigateur et demandez des modifications de textes, de sections ou de tarifs avec vos propres mots
Les photos sont générées avec l'outil d'image de votre agent, ce qui peut entraîner des frais d'utilisation de cet outil ; sans outil, la page se rabat sur des initiales et des cartes produit. Polices et images sont intégrées, le fichier final n'effectue donc aucune requête réseau.
Ce qu'il vous faut avant de commencer
- Vous fournissez
- Nom du produit, ce qu'il fait et pour qui, 4 à 6 fonctionnalités et 2 à 4 forfaits avec de vraies limites (des notes approximatives suffisent) · Facultatif : noms de clients, citations, chiffres et photos que vous êtes autorisé à utiliser
- Dépendances
- Node.js 18 ou version ultérieure sur la machine de votre agent, pour exécuter le script fourni qui génère le fichier unique hors ligne · Un accès à Internet pendant la génération du fichier, pour télécharger une fois les polices et les intégrer · Facultatif : un outil de génération d'images dans votre agent pour les photos du client, éditoriale, des avis et de l'équipe
- Coûts externes
- Les photos sont générées avec l'outil d'image de votre agent, ce qui peut entraîner des frais d'utilisation de cet outil. Sans outil, le site se construit quand même : les avis utilisent des initiales, la photo éditoriale devient une carte produit et la photo d'équipe est retirée.
- Dernier test
- v1.0.4 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
Avis des utilisateurs
Chargement des avis…