Design Snap
Une alternative à WhatFont qui capture tout le système typo
WhatFont est le moyen classique de nommer la police sous votre curseur. Design Snap le fait aussi avec son inspecteur, puis va plus loin : il extrait chaque famille de polices personnalisée de la page avec l'échelle typographique, les graisses et les interlignages, à côté des couleurs, radius et variables CSS — et exporte le tout en Tailwind, CSS ou Figma.
Noté 5,0/5 sur le Chrome Web Store · lire les avis · Plan gratuit · Sans compte · Analyse 100 % locale
Comment récupérer toute la typographie d'un site, pas une seule police
Survoler les éléments un par un vous donne leur police. Extraire la page vous donne le système : quelles familles, quelles tailles, quelles graisses.
-
Installer
Ajoutez Design Snap à Chrome depuis le Chrome Web Store. Plan gratuit, sans compte.
-
Extraire
Ouvrez le site et cliquez sur Extraire. L'onglet Typographie liste chaque famille personnalisée et les tailles et graisses utilisées.
-
Exporter
Exportez l'échelle typo en
tailwind.config.js, variables CSS, JSON ou tokens Figma.
Design Snap vs WhatFont
Rédigé par le développeur de Design Snap — biais annoncé d'emblée. Les fonctionnalités reflètent les deux outils au moment de la rédaction (octobre 2026) ; quand WhatFont est le meilleur outil, le tableau le dit.
| Fonctionnalité | Design Snap | WhatFont |
|---|---|---|
| Identifier la police d'un élément survolé | Oui — inspecteur d'éléments | Oui — sa fonction principale, très rapide |
| Outil ultra-léger à usage unique | Non — un extracteur de design system complet | Oui |
| Toutes les familles personnalisées de la page d'un coup | Oui — polices de repli filtrées | Non — un élément à la fois |
| Tailles dédoublonnées en échelle typographique | Oui | Non |
| Graisses et interlignages utilisés | Oui | Par élément uniquement |
| Couleurs, radius, ombres, variables CSS | Oui | Non |
| Export de la typo en Tailwind, CSS, JSON, Figma | Oui — gratuit | Non |
| Tokens typographiques composites (Style Dictionary) | Oui — PRO | Non |
| Prix | Gratuit · PRO 4,99 € une fois | Gratuit |
Quand WhatFont suffit
Si vous voulez juste le nom d'une police, tout de suite, WhatFont est léger et fait exactement ça. Aucune raison de changer pour une recherche ponctuelle.
Quand il vous faut plus qu'un nom
Savoir qu'un titre est en « Inter 600 » termine rarement la tâche. Vous voulez reconstruire la typographie : la taille du texte courant, l'échelle jusqu'au titre principal, les graisses des labels et des boutons, les interlignages. Avec un outil de survol, ça veut dire échantillonner une douzaine d'éléments et tout noter. Design Snap l'extrait en une passe et vous donne une échelle comme 12 · 14 · 16 · 20 · 24 · 32 avec les graisses 400 · 600 · 700.
Puis il écrit le code : un bloc fontFamily et fontSize pour Tailwind, des variables CSS --font-sans, des tokens Figma, ou des tokens typographiques composites Style Dictionary v3 (PRO). Et comme la typographie ne vit jamais seule, les couleurs, radius, ombres et variables CSS de la page viennent avec.
D'un nom de police à une échelle typo utilisable
Design Snap garde le confort du survol et ajoute la vue système dont designers et développeurs ont vraiment besoin.
- Inspecteur d'éléments pour un élément précis
- Toutes les familles personnalisées, polices de repli filtrées
- Tailles dédoublonnées en échelle, avec graisses et interlignages
- Export Tailwind, variables CSS, JSON ou Figma
- Couleurs, radius et ombres inclus dans la même extraction
Alternative à WhatFont — FAQ
Design Snap est une extension Chrome gratuite qui inspecte n'importe quel élément comme WhatFont, et extrait en plus tout le système typographique de la page — chaque famille, l'échelle de tailles, les graisses et interlignages — avec un export Tailwind, CSS ou Figma.
Oui. Survolez n'importe quel élément avec l'inspecteur du panneau latéral pour voir ses styles calculés, police comprise.
Oui. Design Snap lit le font-family calculé que le navigateur applique, quel que soit le service qui fournit la police.
Oui. L'identification des polices, l'inspecteur et les exports Tailwind, CSS, JSON et Figma sont gratuits. PRO est un paiement unique de 4,99 €.