Aller au contenu

Marque

Reference de marque

Systeme visuel vanityURLs

Cette page documente les decisions de marque actuelles pour le site public et les badges de redirection auto-heberges. Le travail sur les logos continue, donc le placement des logos reste provisoire et les couleurs des badges sont la reference stable.

Couleurs des badges

Les badges de redirection utilisent des fonds transparents. Utilisez le badge clair sur une surface claire et le badge sombre sur une surface sombre.

Redirected, badge clair

#111827

vanityURLs

#0F766E

Swoop

#14B8A6

Redirected, badge sombre

#FFFFFF

Exemples de badges

Surface claire

Badge redirige par vanityURLs.link

Surface sombre

Badge redirige par vanityURLs.link pour surfaces sombres

Fichiers de badges localises

Le site met en miroir les SVG de badge depuis le depot code sous /static/images/. La source de verite pour les instances deployees reste defaults/public/{language}/ dans le depot code.

Badge anglais v8s-redirected-en.svg v8s-redirected-en-dark.svg
Badge francais v8s-redirected-fr.svg v8s-redirected-fr-dark.svg
Badge espagnol v8s-redirected-es.svg v8s-redirected-es-dark.svg
Badge italien v8s-redirected-it.svg v8s-redirected-it-dark.svg
Badge allemand v8s-redirected-de.svg v8s-redirected-de-dark.svg

Typographie

Polices actuelles du site

Le site auto-heberge Inter Variable pour l'interface et les textes, puis JetBrains Mono pour le code. Les fichiers vivent sous /static/fonts/ et sont declares dans assets/css/main.css.

Reference typographique

L'implementation bhdicaire-com utilise Red Hat Display, Red Hat Text, Red Hat Mono et Source Serif 4 avec des tokens fluides de type Utopia. Cette page reprend seulement l'approche fluide, limitee a .brand-system, pour garder le reste du site stable jusqu'a la mise a jour des logos.

Configuration du wordmark d'instance

Les instances gerees par l'installateur peuvent stocker un wordmark en deux couleurs dans custom/v8s-site-config.json. La portion verte devrait utiliser le teal vanityURLs sauf si l'instance a un systeme local volontaire.

{
  "branding": {
    "domain": "example.link",
    "wordmark": {
      "black": "example.",
      "green": "link"
    }
  }
}

Notes d'usage

A faire

Utilisez les badges SVG, gardez les fonds transparents, conservez le texte localise, et lancez npm run optimize:badges apres modification des SVG de badge par defaut dans le depot code.

A eviter

Ne rasterisez pas les badges, n'ajoutez pas de fond opaque, ne recolorez pas une seule langue, et ne traitez pas les logos actuels comme definitifs pendant la mise a jour.

Modifier cette page Dernière modification: