Typography Editor

L’éditeur de typographie offre un espace de travail en direct pour tester les propriétés de police et la sortie CSS. Les designers et les développeurs front-end l’utilisent pour évaluer les choix de font-family, les poids, les tailles, l’interligne et l’espacement des lettres, puis comparer les résultats sur différents points d’arrêt. L’interface mappe les entrées sur des règles typographiques et rend un aperçu fidèle, permettant des ajustements précis avant d’intégrer la typographie à une UI produit.

Conception: l’outil convertit les sélections utilisateur en règles CSS standard et en tokens. Il prend en charge les unités px et rem, convertit les tailles à l’aide d’une taille de police racine et génère un bloc CSS ainsi qu’une configuration JSON structurée pour les design systems. Il supporte aussi les font-variation-settings pour les polices variables.

Public cible: les UI designers, les ingénieurs frontend et les responsables de contenu cherchant une typographie cohérente sur les plateformes. Son intérêt unique réside dans son approche déterministe (unités, échelles et fallbacks) et son exportabilité, réduisant le décalage entre conception et implémentation tout en facilitant l’expérimentation rapide avec les échelles et les espacements. Fonctions clés: blocs d’entrée pour font-family, weight, size, line-height et letter-spacing; support optionnel des URLs de police; aperçu en direct; export CSS; export de tokens JSON; presets responsive pour les breakpoints courants. Cas d’usage: tableaux de bord produits, sites marketing, pages produit e-commerce et portails de documentation.