Griffonne
StablePinceau irrégulier où chaque lettre cache un chat.
Griffonne est une police au pinceau générée en code : des oreilles sur les hampes, des yeux dans les panses, des queues aux terminaisons. Trois tracés alternent pour que deux lettres voisines ne soient jamais identiques. Lisible dès 16 px, féline dès le premier regard.
Pour un site : copier le code CSS ou npm, ou télécharger Griffonne-Regular.woff2 (126 Ko)
Installer sur l’ordinateur
Télécharge le zip, puis suis les 4 étapes de ton système : Griffonne sera dans Word, LibreOffice, Affinity ou Photoshop.
Windows
- Ouvre le zip : clic droit, puis « Extraire tout ».
- Ouvre le dossier otf, puis fais un clic droit sur Griffonne-Regular.otf. Pour de petites tailles à l’écran, prends plutôt ttf/Griffonne-Regular.ttf.
- Choisis « Installer » (ou « Installer pour tous les utilisateurs »).
- Ferme et rouvre ton logiciel : Griffonne apparaît dans la liste des polices.
macOS
- Double-clique sur le zip pour l’ouvrir.
- Ouvre le dossier otf, puis double-clique sur Griffonne-Regular.otf : le Livre des polices s’ouvre.
- Clique sur « Installer ».
- Ferme et rouvre ton logiciel : Griffonne apparaît dans la liste des polices.
Linux
- Décompresse le zip.
- Copie le dossier otf dans ~/.local/share/fonts.
- Dans un terminal, lance la commande fc-cache -f.
- Ferme et rouvre ton logiciel : Griffonne apparaît dans la liste des polices.
Ça ne marche pas ?
- La police n’apparaît pas dans mon logiciel
- Ferme complètement le logiciel, puis rouvre-le. Certains logiciels ne lisent les polices qu’au démarrage.
- L’ancienne version s’affiche encore
- Désinstalle d’abord l’ancienne version de Griffonne, puis installe la nouvelle.
Le problème continue ? Signale-le sur GitHub.
Dans tes logiciels
- Word, LibreOffice, Affinity, Photoshop
- Griffonne apparaît dans la liste des polices après l’installation et un redémarrage du logiciel.
- Google Docs
- Ne lit pas les polices installées sur l’ordinateur. Pour un titre, crée-le ailleurs et colle-le en image.
- Canva
- Importer une police demande un abonnement payant ou une offre Éducation ou Associations.
- Figma dans le navigateur
- Installe l’outil de polices de Figma (font installer) ou utilise l’application de bureau.
Essayer
L’été, la petite chatte grimpe au balcon !
Ou choisis un exemple
Bien l’utiliser : Texte dès 16 px avec un interlignage d’au moins 1,5 ; chats complets (ss01) pour les titres dès 32 px.
Glyphes (317)
Langues
Griffonne couvre 8 langues : français, anglais, allemand, espagnol, polonais, tchèque, roumain et turc.
- FrançaisPortez ce vieux whisky au juge blond qui fume !
- AnglaisThe quick brown fox jumps over the lazy dog.
- AllemandVictor jagt zwölf Boxkämpfer quer über den großen Sylter Deich.
- EspagnolEl veloz murciélago hindú comía feliz cardillo y kiwi.
- PolonaisZażółć gęślą jaźń.
- TchèquePříliš žluťoučký kůň úpěl ďábelské ódy.
- RoumainMuzicologă în bej vând whisky și tequila, preț fix.
- TurcPijamalı hasta yağız şoföre çabucak güvendi.
Écris un mot pour voir si toutes ses lettres existent dans Griffonne.
Œuvre, Straße, Łódź, ğüşı
Utiliser sur un site
Lien CSS
Le plus simple : colle ce CSS, la police est servie depuis mon site.
@import url("https://polices.danaedev.fr/fonts/griffonne/index.css");
h1 {
font-family: "Griffonne", cursive;
}npm (Vite, Nuxt…)
Installe le paquet, puis importe-le une fois dans ton point d’entrée : il charge sa feuille CSS.
npm install @danaedev/griffonne
// main.js
import '@danaedev/griffonne';
/* styles.css */
h1 {
font-family: "Griffonne", cursive;
}Tailwind 4
Après npm install @danaedev/griffonne, déclare la police dans @theme : la classe font-griffonne devient disponible.
@import "tailwindcss";
@import "@danaedev/griffonne";
@theme {
--font-griffonne: "Griffonne", cursive;
}
/* Dans le HTML : <h1 class="font-griffonne">…</h1> */Héberger moi-même
Copie le dossier woff2 du zip dans ton site : il contient la police et sa feuille CSS.
<link rel="preload" href="/woff2/Griffonne-Regular.woff2" as="font" type="font/woff2" crossorigin>
<link rel="stylesheet" href="/woff2/index.css">
<style>
h1 {
font-family: "Griffonne", cursive;
}
</style>Ce que la licence permet
Griffonne est sous licence SIL Open Font License 1.1.
Tu peux
- l’utiliser gratuitement, même pour un projet commercial (logo, affiche, livre, site, appli) ;
- l’intégrer à un site, une appli ou un document PDF ;
- la modifier et partager ta version.
Tu ne peux pas
- vendre la police seule, telle quelle ;
- retirer la licence ou les crédits des fichiers.
Mentionner l’autrice n’est pas obligatoire, mais fait plaisir. Par exemple :
Police Griffonne par Danaé ALBRECHT--MARTIN (danaedev.fr), licence SIL OFL 1.1
Historique des versions
Corrections
- Le nom « Griffonne » n’est plus réservé : une version modifiée peut le garder.
Nouveautés
- première version publique : couverture GF Latin Core (8 langues), fonctions
calt,ss01« Chats complets »,caseetzero
Corrections
- contours sans segments de longueur nulle ; contrôle Font Bakery à 0 échec, spécimen à 0 violation axe-core (
documentation/qualite.md)
Nouveautés
- création du projet et moteur de pinceau (texture B, ondulation longue ±10 à graine fixe)
- minuscules complètes, niveau félin « marqué » par défaut : un élément de chat sur chaque lettre (oreilles, visages, queues)
- capitales A–Z, chiffres tabulaires 0–9 aux oreilles homogènes, ponctuation et espace fine insécable
- diacritiques, œ æ Œ Æ et 145 accentuées composées : typographie française complète
- lettres spéciales (ß ẞ ø ł đ ð þ ħ ª º…) et symboles : GF Latin Core couvert à 100 %
- espacement optique et crénage mesuré (400 paires de classes)
- métriques verticales 985 / −265 : rien ne dépasse, capitales centrées dans les boutons
Corrections
- point du j centré sur son fût
- queue du l raccourcie et relevée : il ne se lit plus comme un L en petit