Studio de captures de code

CodeCard

Convertissez vos extraits de code en magnifiques images de capture prêtes à être partagées, 100% localement dans votre navigateur.

48 langagesFonctionne dans votre navigateurSans compte ni envoi

Collez votre extrait de code

6 lignes · Déposez un fichier source ici, ou collez le code.

Langage de programmation

Thème de coloration

Nom du fichier / Titre

Numéro de la première ligne

Lignes mises en avant

Ou cliquez les numéros de ligne dans l’aperçu. Maj+clic pour une plage, Alt+clic inverse, clic droit efface.

Atténuer les autres lignes

Aperçu en direct

100%

fetch-user.ts

// Pega aquí tu fragmento de código
export async function fetchUser(id: string) {
  const res = await fetch(`/api/users/${id}`);
  if (!res.ok) throw new Error(`HTTP ${res.status}`);
  return res.json();
}

Coloration dans votre navigateur. Votre code ne quitte pas cet appareil.

ContinuezVotre image vous suit, sans réenvoi

Comment ça marche

Collez ou déposez votre code

Tapez, collez ou déposez un fichier source. Le fichier attend : sa taille et son nombre de lignes s’affichent, et rien ne se charge avant votre clic.

Stylisez et choisissez les lignes clés

Dix thèmes, neuf dégradés ou votre couleur, cinq habillages de fenêtre. Cliquez un numéro de ligne pour la mettre en avant et atténuer le reste.

Exportez ou envoyez plus loin

PNG, JPEG, WebP ou SVG vectoriel, jusqu’à 4x. Copiez dans le presse-papiers, ou transmettez l’image a CompressSnap, CropSnap ou WatermarkSnap sans la télécharger.

Vraie coloration, 48 langages

Le coloriseur lit le flux de jetons brut de Prism : JavaScript, Rust, Zig, Terraform, Dockerfile et 43 autres sortent avec les bonnes couleurs — et seule la grammaire choisie est téléchargée.

Mettez en avant les lignes utiles

Cliquez un numéro de ligne pour la souligner et atténuer le reste. Maj+clic prend une plage, Alt+clic inverse toute la sélection, clic droit l’efface.

Des exports dont rien n’est coupe

La carte est mesurée à sa largeur réelle avant capture : les longues lignes survivent à l’export au lieu d’être tronquées au bord de l’aperçu. PNG, JPEG, WebP ou SVG vectoriel, jusqu’à 4x.

Local, et vraiment hors ligne

Polices et grammaires viennent de ce site, pas d’un CDN tiers. Une fois la page chargée, coloration et export fonctionnent réseau débranché.

Foire Aux Questions

Pourquoi mes longues lignes étaient-elles coupées ailleurs ?+

Parce que la plupart des outils capturent le DOM tel qu’il est mis en page, et un bloc de code avec barre de défilement horizontale ne met en page que la partie visible. CodeCard mesure la carte à sa largeur réelle, non rognée, avant la capture.

Comment mettre certaines lignes en avant ?+

Cliquez un numéro de ligne dans l’aperçu pour la souligner et atténuer le reste. Maj+clic étend une plage, Alt+clic inverse toute la sélection, le clic droit l’efface. Vous pouvez aussi saisir des plages comme 3, 7-9, 12.

Quels langages sont pris en charge ?+

48, dont JavaScript, TypeScript, JSX/TSX, Python, Rust, Go, Zig, C, C++, C#, Java, Kotlin, Swift, Ruby, PHP, SQL, YAML, TOML, Terraform, Dockerfile, Bash, PowerShell, Markdown et les diffs unifiés. Seule la grammaire choisie est téléchargée.

Puis-je utiliser CodeCard hors ligne ?+

Oui. Les polices monospace et les grammaires viennent de ce site et non d’un CDN tiers : une fois la page chargée, coloration et export continuent sans réseau.

Mon code est-il en sécurité ?+

Votre code n’est transmis nulle part. Coloration, mise en page et rendu de l’image se font dans votre navigateur ; rien n’est envoyé ni journalise.

Quel réglage donne l’export le plus net ?+

PNG en 3x ou 4x pour un usage matriciel. Si la destination accepte les vecteurs, choisissez SVG : il reste net à toute taille et pese souvent moins qu’un PNG 4x.

Créez de superbes images de vos codes sources en ligne

Partager du code sous forme de texte brut sur les réseaux sociaux ou dans des présentations peut être visuellement ennuyeux. CodeCard transforme instantanément votre code en cartes au design élégant. Ajustez l'espacement, les ombres, les polices et le style de fenêtre pour correspondre à votre identité.

PNG, JPEG, WebP et SVG vectoriel jusqu’à 4x
Polices et grammaires auto-hébergées : fonctionne hors ligne
Sans compte, et le filigrane est désactivé par défaut

Génération locale rapide et sécurisée

CodeCard s'exécute entièrement dans votre navigateur via un rendu côté client. Aucun fichier ou texte ne quitte jamais votre ordinateur.

Parfait pour les Réseaux Sociaux, les Blogs et les Diapositives

Idéal pour les influenceurs tech sur Twitter/X, les développeurs rédigeant des articles techniques et les enseignants créant des diaporamas. Les beaux visuels doublent le taux d'engagement.

Confidentialité stricte garantie

Contrairement à d'autres outils qui envoient votre code à des API externes, CodeCard effectue toute la coloration et le rendu à l'intérieur de votre navigateur. Vos clés privées ou propriété intellectuelle restent 100% sécurisées.

Base sur le flux de jetons de Prism

Plutôt que de demander au coloriseur du HTML fini, CodeCard lit le flux de jetons brut et reconstruit le code ligne par ligne. C’est ce qui rend possibles les numéros exacts, la mise en avant par ligne, le renvoi avec retrait et les exports non rognés.