01L’atelier de cartes GitHub

Générateur de README de profil GitHub

GitHubCard est un générateur de README de profil GitHub par glisser-déposer. Réunissez vos statistiques, projets et activités dans une carte.

Ouvrir l’éditeurVoir des cartes réelles
Aperçu GitHubCard en direct pour torvalds
rendu à partir des données GitHub à jour
02Le problème

Remplacez plusieurs intégrations README par un lien GitHubCard.

Dans un README fait à la main, statistiques, langages, contributions, activité et compétences peuvent demander six intégrations, cinq services et des dizaines de paramètres d’URL. GitHubCard rassemble ces données dans une seule création. Un lien suffit dans votre README.

README.md
@@ -1,29 +1,6 @@
  1. # Hi, I'm Alex 👋
  2. Full-stack developer building useful products.
  4. <!-- Profile and repository stats -->
  5. ![GitHub stats](https://github-readme-stats.vercel.app/api?username=you&show_icons=true&theme=tokyonight&hide_border=true)
  7. <!-- Top languages -->
  8. <a href="https://github.com/you?tab=repositories">
  9. <img height="165" src="https://github-readme-stats.vercel.app/api/top-langs?username=you&layout=compact&theme=tokyonight" alt="Top languages" />
  10. </a>
  12. <!-- Commit streak -->
  13. <p align="center">
  14. <img width="48%" src="https://streak-stats.demolab.com?user=you&theme=tokyonight&hide_border=true" alt="Commit streak" />
  15. </p>
  17. <!-- Contribution heatmap (light / dark) -->
  18. <picture>
  19. <source media="(prefers-color-scheme: dark)" srcset="https://ghchart.rshah.org/2f81f7/you" />
  20. <img src="https://ghchart.rshah.org/40c463/you" alt="Contribution heatmap" />
  21. </picture>
  23. <!-- Activity graph -->
  24. [![Activity graph](https://github-readme-activity-graph.vercel.app/graph?username=you&theme=github-compact)](https://github.com/you)
  26. <!-- Tech skills -->
  27. ![Tech skills](https://skillicons.dev/icons?i=ts,react,nodejs,docker,postgres&theme=dark)
  29. ## Featured projects
  1. # Hi, I'm Alex 👋
  2. Full-stack developer building useful products.
  4. ![GitHubCard](https://githubcard.com/you.svg?d=N7kQ2mXp4Vr8Ls1C)
  29. ## Featured projects
Avant · Markdown + HTML + 6 intégrations + 5 servicesAprès · 1 lien de création, les mêmes données GitHub
03Widgets

Un choix de composants.

Statistiques GitHub, cartes thermiques des contributions, séries de commits, langages, technologies, principaux dépôts et Star History. Choisissez vos composants, placez-les sur le canevas et appliquez un thème commun.

8 widgets sur plus de 20 · survolez pour mettre en pause
Langages en anneau
Aperçu du widget en anneau des langages GitHubCard
Classement des langages en barres
Aperçu du classement des langages en barres GitHubCard
Statistiques de profil
Aperçu du widget de statistiques de profil GitHubCard
Statistiques des contributions consécutives
Aperçu du widget de contributions consécutives GitHubCard
Carte thermique des contributions
Aperçu du widget de contributions GitHubCard
Tendances des stars
Aperçu du widget Star History GitHubCard
Commits du dépôt
Aperçu du widget de commits de dépôt GitHubCard
Fréquence du code du dépôt
Aperçu du widget de fréquence du code GitHubCard
Langages en anneau
Aperçu du widget en anneau des langages GitHubCard
Classement des langages en barres
Aperçu du classement des langages en barres GitHubCard
Statistiques de profil
Aperçu du widget de statistiques de profil GitHubCard
Statistiques des contributions consécutives
Aperçu du widget de contributions consécutives GitHubCard
Carte thermique des contributions
Aperçu du widget de contributions GitHubCard
Tendances des stars
Aperçu du widget Star History GitHubCard
Commits du dépôt
Aperçu du widget de commits de dépôt GitHubCard
Fréquence du code du dépôt
Aperçu du widget de fréquence du code GitHubCard
04Comment ça marche

Trois étapes, sans configuration.

Le même parcours que dans l’éditeur : choisir une carte, la créer et la publier.

L’éditeur en 16 secondes.
05Cartes réelles

De vrais dépôts, un système de cartes commun.

De vraies cartes GitHubCard pour des dépôts publics, mises à jour chaque jour. Trois utilisent un fond Pro.

Carte de dépôt GitHubCard pour supabase/supabase

Supabase

supabase/supabase

Ouvrir
En pratique →chris-grieser.decodes.oeiuwq.comwilliams.science/resourcespages intégrant GitHubCard vérifiées manuellement
Créer une carte de dépôt
06Comparer

Un canevas face aux outils spécialisés.

Comparez le parcours d’édition, le résultat et l’entretien nécessaire.

01Bilan

Parcours

Avec GitHubCard, tout se fait sur un canevas, de l’édition visuelle à la carte finale.

GitHubCard
Mise en page, données et widgets se règlent dans le même parcours d’édition.
Outils spécialisés
Les outils spécialisés répartissent les réglages entre plusieurs générateurs.
Éditeur visuelUn canevasMoins d’assemblage
02Bilan

Résultat

Vous obtenez une carte au style cohérent.

GitHubCard
Les éléments de profil, de dépôt et de statistiques partagent le même style visuel.
Outils spécialisés
Les autres outils exportent généralement des cartes, graphiques ou URL séparés.
Style communComposition finalePrêt à exporter
03Bilan

Entretien

Moins de dépendances, c’est moins de jetons, de tâches planifiées et d’actualisations manuelles.

GitHubCard
Les cartes s’actualisent à partir de GitHub, avec un comportement de cache prévisible.
Outils spécialisés
La fiabilité dépend souvent de l’hébergement, des tâches planifiées ou des limites d’API.
Configuration réduiteActualisation automatiqueLimites explicites

Cette comparaison porte sur des catégories d’outils, sans viser de marque.

07Tarifs

Commencez gratuitement. Payez une fois pour Pro.

Créez et prévisualisez gratuitement. Pro Lifetime coûte 19 $ en une fois pour les fonds et polices premium, les exports sans filigrane et en 4×. Sans abonnement.

Paiement unique · Sans abonnement · Remboursement sous 7 jours. Voir tous les tarifs

08Questions

Vos questions avant de publier.

Qu’est-ce que GitHubCard ?

GitHubCard est un générateur visuel de README de profil GitHub. Organisez vos données en cartes de profil et de dépôt pour un README, un portfolio ou une publication sociale.

Comment utiliser GitHubCard ?

Remplacez github.com par githubcard.com dans l’URL d’un profil ou d’un dépôt, comme githubcard.com/torvalds ou githubcard.com/facebook/react. Ouvrez l’éditeur pour personnaliser la carte.

Dois-je me connecter ?

Prévisualisez les cartes par défaut sans connexion. Connectez-vous avec GitHub pour enregistrer, publier, modifier ou supprimer vos créations.

Comment intégrer une carte dans mon README ?

Copiez l’URL SVG (par exemple githubcard.com/username.svg) et ajoutez-la comme image dans votre fichier Markdown. La carte affichera les données à jour de GitHub.

Comment créer un README de profil GitHub ?

Créez un dépôt portant votre nom d’utilisateur GitHub, puis ajoutez un fichier README.md. GitHub l’affiche sur votre profil si le dépôt est public et correctement nommé.

Guide du README de profil GitHub
Les cartes se mettent-elles à jour automatiquement ?

Oui. Les cartes affichent les données GitHub à jour. Le cache améliore les performances ; les changements peuvent prendre jusqu’à une heure à apparaître.

Puis-je personnaliser mes cartes ?

Oui. Glissez plus de 20 widgets dans l’éditeur, ajustez la mise en page, puis exportez en SVG ou PNG.

GitHubCard est-il gratuit ?

Les fonctions principales sont gratuites. Pro Lifetime coûte 19 $ en une fois, sans abonnement, pour les fonds et polices premium, les exports sans filigrane et en haute résolution (4×).

Commencez quand vous voulez

Créez votre carte. À votre façon.

Ouvrez le canevas, ajoutez vos données GitHub et créez une carte pour votre README ou votre site.

Ouvrir le canevas