Design system Sellamm
Les tokens, composants et la marque — le bayamm qui vend, jour et nuit — réunis dans une référence interactive. Clique, règle, copie.
Fondations
Palette
Sept couleurs, un équilibre. Le vert règne, l’or récompense, les crèmes font respirer.
Astuce : clique sur une couleur pour copier son hex. Règle d’or — jamais plus de deux couleurs vives à la fois. Le vert domine, l’or ponctue, le reste ancre et fait respirer.
Fondations
Typographie
Poppins pour la voix qui accroche, Inter pour la voix qui explique.
Tu ne perds plus une vente
Display — Poppins Bold
Ton bayamm accueille tes clients, donne les prix, gère les objections — et te passe la main pour conclure.
Texte — Inter Regular
Fondations
Icônes
Un jeu d’icônes cohérent (Lucide via Iconify), chargé hors-ligne et teinté par le texte.
Icônes Lucide via Iconify, empaquetées hors-ligne (aucune requête réseau). Elles héritent de la couleur du texte. Clique pour copier le code.
Composants
Boutons — atelier interactif
Choisis la variante, la taille, l’état : l’aperçu et le code se mettent à jour en direct.
Variante
Taille
<Button variant="primary" size="md">
Activer ton bayamm
</Button>Composants
Formulaires
Champs, sélecteurs, cases, interrupteur — avec libellés, aide et états d’erreur accessibles.
On ne partage jamais ton email.
Numéro invalide (exemple d’état erreur).
Le bouton s’active une fois la case cochée.
Composants
Feedback & états
Encarts sémantiques, chargement et infobulles — pour toujours montrer où on en est.
Info
Vente conclue
Attention
Erreur
Skeletons (chargement > 300 ms) :
Composants
Cartes
Quatre tons, du plus discret au plus profond. Change de ton et regarde la carte suivre.
Carte « card »
Usage par défaut, sur fond clair.
<Card tone="card" />
Composants
Badges
Des pastilles d’état, pilule et sobres. L’or ne sert qu’aux moments de gain.
Structure
Navigation & structure
Onglets, accordéon (FAQ), en-tête et pied de page — de quoi bâtir une vraie page.
Onglets accessibles : rôle tablist, panneaux reliés par aria.
Les avis clients viendront ici.
Voir l’accordéon ci-contre.
En-tête et pied de page prêts à l’emploi (SiteHeader / SiteFooter) :
Blocs de section
Fonctionnalités & chiffres
Des blocs prêts à assembler une page : grille de fonctionnalités et rangée de chiffres-clés.
Il accueille tes clients
Le bayamm répond, salue et met à l’aise — même quand tu dors.
Il donne les prix
Catalogue et tarifs toujours à jour, sans erreur ni oubli.
Il gère les objections
Réponses prêtes aux questions fréquentes, ton toujours juste.
Il te passe la main
Au bon moment, il te relaie pour conclure la vente.
Il apprend ta boutique
Plus il discute, mieux il connaît tes produits et ton style.
Il ne perd rien
Chaque contact est gardé, aucune vente ne file entre les doigts.
24/7
Toujours disponible
< 1 min
Temps de réponse
+35%
Ventes conclues
0
Contact perdu
Blocs de section
Tarifs
Grille tarifaire props-driven : bascule mensuel / annuel, badge d’économie, offre mise en avant.
Découverte
Pour tester ton bayamm.
Gratuit
- 1 boutique
- 100 conversations / mois
- Réponses automatiques
- Support prioritaire
Pilote
Pour vendre pour de vrai.
5 000 F/mois
- Boutique illimitée
- Conversations illimitées
- Catalogue & prix
- Support prioritaire
Marché
Pour plusieurs points de vente.
15 000 F/mois
- Tout de Pilote
- Plusieurs boutiques
- Statistiques avancées
- Accompagnement dédié
Blocs de section
Témoignages & appel à l’action
Preuve sociale et bandeau de conversion — la fin de page d’une vitrine.
“Depuis que mon bayamm répond la nuit, je ne rate plus une commande.”
Aminata
Prêt-à-porter, Yaoundé
“Les clients ont les prix tout de suite. Je conclus plus vite.”
Boris
Électronique, Douala
“C’est comme avoir un vendeur en plus, sans le salaire en plus.”
Chantal
Cosmétiques, Yaoundé
Prêt à ne plus perdre une vente ?
Active ton bayamm et laisse-le vendre, jour et nuit.
Fondations
Rayons, espacement, élévation
Les constantes qui donnent le rythme : formes rondes, respiration régulière, ombres douces.
Rayons
Espacement
Élévation
Marque
Le bayamm
Les visages officiels de la marque, à l’échelle que tu veux.
Le bayamm — logo, avatar et scène — provient des images officielles de la charte. La pièce ₣ est l’étincelle du gain : rare, précieuse.
