Exemples de Composants
Cette page présente tous les composants et sections disponibles dans le design system du site.
Composants
Badge
Badge Hero par défaut
Badge Hero personnalisé
Badge Tag avec icône
Badge Tag personnalisé
Badge Services avec icône
Badge Services personnalisé
Badge Tag sans icône
Badge Services sans icône
TITLE HERO
TITLE HERO
Titre Hero Standard
Salut, moi c'est Maxime 👋 CTO, Tech advisor, sparing partner
Titre Hero Personnalisé
Bienvenue sur mon site Développeur Full Stack
Titre Hero avec Emoji
Hello World! 🌍 Passionné de technologie
Titre Hero Minimal
Mon Portfolio Créateur digital
Bouton CTA
Bouton par défaut (primary)
Faisons connaissanceBouton primary explicite
Bouton primaryBouton secondary
Bouton secondaryBouton large
Bouton largeBouton avec URL personnalisée
Visiter le siteBouton secondaire
Voir mes réalisationsBouton avec classe personnalisée
Mon CVBouton par défaut
Faisons connaissanceBouton avec lien externe
Visiter GitHubBouton secondaire externe
LinkedInIMAGE
Image par défaut
Avec image personnalisée
Sans status
Avec status personnalisé
Image et status personnalisés
IMAGE CIRCLE
Image circle par défaut
Avec image personnalisée
Sans status
Avec status personnalisé
Image et status personnalisés
IMAGE SECONDARY
Image Secondary par défaut
d'expérience
Avec image personnalisée
d'expérience
Avec badge personnalisé
d'expérience
Sans badge
Complètement personnalisée
réalisés
Avec badge différent
client
CTA INFO
CTA Info par défaut
Avec 2 éléments
Avec 4 éléments
Avec icônes personnalisées
Avec un seul élément
LIST CHECKED
List Checked par défaut
Mes compétences principales
Avec 3 éléments
Technologies
Avec icônes personnalisées
Services
Sans titre
Avec un seul élément
Spécialité
STAT NUMBER
Stat Number par défaut
Différents formats
Grands nombres
Nombres décimaux
Avec durée
LIST FOOTER LINK
List Footer Link par défaut
Avec liens externes
Sans liens (texte simple)
Sans titre
Avec un seul élément
LIST HORIZONTAL ICON
List Horizontal Icon par défaut
Avec 2 éléments
Avec icônes personnalisées
Avec un seul élément
Avec emojis
CARD QUOTE
Card Quote par défaut
"Citation par défaut"
Nom de l\
Rôle de l\
Card Quote personnalisée
"Un développeur exceptionnel qui a su transformer notre vision en réalité technique."
Marie Dubois
CEO, TechStart
Avec 4 étoiles
"Collaboration fluide et résultats dépassant nos attentes."
Pierre Martin
CTO, InnovCorp
Sans étoiles
"Une expertise technique remarquable et une approche très professionnelle."
Sarah Chen
Product Manager, DigitalFlow
Avec avatar personnalisé
"Le projet a été livré en avance avec une qualité exceptionnelle."
Thomas Laurent
Directeur Technique, WebAgency
Card Quote courte
"Excellent travail !"
Julie Moreau
Chef de projet
SECTION HEADER
Section Header par défaut
Titre de section
Section Header complète
Comment puis-je vous aider ?
Je propose une gamme complète de services pour transformer vos idées en solutions digitales performantes et évolutives.
Avec highlight
Ils me font confiance
Grâce à mon engagement et ma culture de l'impact, je suis un partenaire de confiance pour vos projets.
Sans badge
À propos de moi développeur passionné
Découvrez mon parcours et mes compétences dans le développement web et mobile.
Section Header simple
Mes derniers articles
Retrouvez mes réflexions sur le développement, l'entrepreneuriat et les nouvelles technologies.
Avec titre long
Découvrez mes réalisations et projets
Une sélection de mes projets les plus marquants, allant du développement web aux applications mobiles.
CARD HIGHLIGHT
Card Highlight par défaut
Titre de la carte
Avec badges
Développement Web
Création d'applications web modernes et performantes avec les dernières technologies.
Avec liste
Applications Mobiles
Développement d'applications mobiles cross-platform et natives.
- Interface utilisateur, Performance, Tests, Déploiement
Sans icône
Consulting Tech
Accompagnement dans vos choix technologiques et l'optimisation de vos processus.
Card Highlight simple
Design UI/UX
Conception d'interfaces utilisateur intuitives et esthétiques.
- Wireframes, Prototypes, Tests utilisateurs
Avec mots-clés longs
Cloud & DevOps
Mise en place d'infrastructures cloud scalables et automatisées.
CARD EXPERIENCE
Card Experience par défaut
Lead Developer
TechCorpDirection d'une équipe de 5 développeurs sur des projets innovants utilisant React, Node.js et AWS.
Poste actuel
CTO & Co-founder
StartupInnovanteCofondation et direction technique d'une startup spécialisée dans l'IA générative.
Avec expansion (plus de 3 achievements)
Senior Full-Stack Developer
DigitalAgencyDéveloppement d'applications web complexes pour des clients internationaux.
Sans logo (placeholder)
Frontend Developer
WebStudioDéveloppement d'interfaces utilisateur modernes et responsives.
Avec détails supplémentaires
Freelance Developer
IndépendantDéveloppement de solutions web sur mesure pour des PME.
Card Experience courte
Junior Developer
TechStartPremière expérience professionnelle dans le développement web.
Terminal Animé
Sections
Section CTA
Section CTA Finale
Prêt à découvrir votre projet ?
Transformons ensemble votre vision en réalité digitale. Planifiez dès aujourd'hui un rendez-vous.