Convertisseur de polices
Font Converter
Convertit TTF et OTF en WOFF et inversement dans le navigateur et rend la règle @font-face correspondante ; le WOFF2 réclame Brotli et est refusé, avec un renvoi vers les outils de bureau.
Convertit entre les formats sfnt et WOFF 1.0 dans les deux sens, en déduisant la direction du fichier que vous déposez. Les deux sens sont sans perte : WOFF est un conteneur, donc emballer et déballer rend les mêmes tables, avec `head.checkSumAdjustment` recalculé pour que le résultat soit valide. Le WOFF2 est refusé, et la page explique pourquoi plutôt que d’échouer en silence.
TTF · OTF → WOFF, ou WOFF → TTF · OTF
Déposez un fichier et le sens est déduit pour vous. Tout se passe dans cet onglet.
Ce qui marche et ce qui ne marche pas
- · TTF et OTF ⇄ WOFF 1.0 : zlib table par table, avec un en-tête et un répertoire de 44 octets, comme le dit la spécification WOFF (W3C, 2012). La compression est le
CompressionStream('deflate')du navigateur lui-même, et la décompression réassemble le sfnt avec les sommes de contrôle d’origine pour quehead.checkSumAdjustmenttombe juste. Les deux sens sont sans perte. - · WOFF2 ne peut être ni construit ni décompressé. Il lui faut Brotli, et la plateforme web n’expose pas Brotli à une page. S’il vous faut du WOFF2, prenez un outil de bureau : il est en général encore 20 à 30 % plus petit que le WOFF.
- · TTF ⇄ OTF (CFF), c’est-à-dire changer de format de contours, relève du redessin et non de la conversion ; ce n’est donc pas proposé. Un .otf qui est du TrueType à l’intérieur et ne trompe que par son extension est traité normalement.
- · La licence d’une police (OS/2 fsType) n’est pas modifiée par la conversion. Vérifiez les conditions de distribution avant de la mettre sur un serveur.
Pour le poids, le sous-ensemble l’emporte de loin sur la conversion de format : le sous-ensemble de police allège une police de hangul de plus de 90 % une fois ramenée au jeu de 2 350 syllabes.
Comment s’en servir
Déposez un fichier
Un TTF ou un OTF est emballé en WOFF ; un WOFF est déballé en TTF ou en OTF selon les contours qu’il porte. Il n’y a pas de sélecteur de direction parce que la signature des quatre premiers octets dit déjà de quel côté aller.
Regardez les tailles avant et après
Passer en WOFF enlève d’ordinaire 40 à 50 %, ce qui est du zlib table par table et rien d’astucieux. Si cela bouge à peine, la police contient probablement déjà des données compressées — une police CFF avec beaucoup de charstrings compactés, par exemple.
Prenez le fichier et le @font-face
La déclaration suppose que le fichier est à côté de la feuille de style, et les valeurs de graisse et d’italique sont lues dans les tables OS/2 et post de la police plutôt que devinées d’après le nom de fichier.
Questions fréquentes
Pourquoi ne fait-il pas le WOFF2 ?
WOFF2 est compressé en Brotli et réordonne et transforme aussi les tables de glyphes. La plateforme web donne à une page un `CompressionStream` avec deflate et gzip seulement — pas de Brotli, donc aucun des deux sens n’est possible dans un navigateur. Sur un poste, fonttools (`pyftsubset --flavor=woff2`) ou `woff2_compress` le fait, pour grossièrement 20 à 30 % de plus que le WOFF.
Peut-il transformer un TTF en véritable OTF ?
Non, et rien d’honnête ne le peut. TrueType emploie des courbes quadratiques et CFF des cubiques ; passer des unes aux autres est un réajustement de courbes avec une tolérance, ce qui change les contours — c’est redessiner la police, pas la convertir. Ce que ceci gère, c’est le cas courant d’un `.otf` qui contient des contours TrueType, où seule l’extension induit en erreur.
Ai-je encore besoin du WOFF, ou le TTF suffit-il ?
Un TTF servi en gzip ou en brotli par le serveur finit près du WOFF, donc le format compte moins qu’avant. Le WOFF vaut quand même la peine : il compresse même quand le serveur ne le fait pas, et tous les navigateurs qui comptent le prennent en charge depuis dix ans. Le gain de loin le plus grand est la réduction à un sous-ensemble, pas le conteneur.
La conversion change-t-elle ce que la licence autorise ?
Non. Le fsType d’OS/2 et tous les enregistrements de nom passent inchangés, ce qui veut dire qu’une police que vous n’avez pas le droit d’intégrer reste une police que vous n’avez pas le droit d’intégrer une fois devenue un WOFF. Vérifiez les conditions de distribution avant de la poser sur un serveur ; l’inspecteur montre ces enregistrements.
À alimenter depuis
Inspecteur de police
Font Inspector
Ouvre un fichier de police et montre la couverture de glyphes par bloc, le nombre de syllabes coréennes, les graisses, les axes variables, l’autorisation d’incorporation et les mentions de licence.
Sous-ensemble de police
Font Subsetter
Réduit une police TrueType aux seuls glyphes que votre texte utilise vraiment et sait emballer le résultat en WOFF — la différence entre une police web de 4 Mo et de 90 ko.
Éditeur et explicateur SVG
SVG Editor and Explainer
Modifie un SVG à côté de son rendu et explique le fichier : le viewBox et la mise à l’échelle, les transformations, chaque commande de tracé, la peinture héritée, les octets inutiles, et ce qui casse dans une balise img, dans un data URI ou en inline.
Mise en situation sur appareil
Device Mockup
Place une capture d’écran dans un cadre de téléphone, de tablette, d’ordinateur portable ou de navigateur, avec fond et ombre.
Ensuite
Ces outils acceptent ce que celui-ci produit : le résultat peut y aller directement.
Formater ou minifier du CSS
CSS Beautifier & Minifier
Met en forme ou minifie du CSS sans rien réordonner, en conservant le flux de jetons à l’identique.
Inspecteur de police
Font Inspector
Ouvre un fichier de police et montre la couverture de glyphes par bloc, le nombre de syllabes coréennes, les graisses, les axes variables, l’autorisation d’incorporation et les mentions de licence.
Sous-ensemble de police
Font Subsetter
Réduit une police TrueType aux seuls glyphes que votre texte utilise vraiment et sait emballer le résultat en WOFF — la différence entre une police web de 4 Mo et de 90 ko.
Convertisseur de formats de couleur
Colour Format Converter
Convertit une couleur entre HEX, RGB, HSL, HWB, LAB, LCH et OKLCH et nomme la couleur connue la plus proche.
Sélecteur de couleur
Colour Picker
Choisit une couleur sur un champ OKLCH, à la pipette sur l’écran ou depuis une image, et la copie dans la notation de votre choix.
Vérificateur de contraste
Contrast Checker
Note un couple texte et fond selon WCAG 2 et APCA et propose la couleur conforme la plus proche.