Icônes, couleurs et thèmes

Personnalisez les icônes, les couleurs, les thèmes et d’autres paramètres plus fins dans toute votre documentation publiée

A GitBook screenshot showing title, icon and logo customization

Titre

Vous pouvez définir le titre de votre choix pour votre espace. Remarque : ce paramètre n’affectera que le titre affiché dans la documentation publiée. Si vous souhaitez modifier le titre dans l’application GitBook, fermez le menu de personnalisation et modifiez-le en haut de l’espace.

Icône

Vous pouvez définir un emoji ou importer votre propre icône. L’icône que vous définissez dans le Personnalisation menu sera utilisée comme favicon pour votre site de documentation.

circle-info

Ce paramètre n’affectera que l’icône affichée dans la documentation publiée. Si vous souhaitez modifier l’icône utilisée dans l’application GitBook, vous pouvez le faire lors de la modification du contenu dans l’espace lui-même.

Logo personnalisé (Premium et Ultimate)

Vous pouvez remplacer à la fois le titre et l’icône de l’espace publié par un logo personnalisé afin que votre documentation reflète mieux votre identité visuelle — et vous pouvez téléverser deux versions : une pour le mode clair et une pour le mode sombre.

circle-info

Quelle est la différence entre les options d’icône et de logo ?

Le paramètre d’icône vous permet de téléverser une petite image de 132 × 132 px, qui apparaîtra à côté de le titre de votre espace et servira de favicon pour votre site. L’option de logo personnalisé vous permet de téléverser une image plus grande (nous recommandons au moins 600 px de large), qui remplacera complètement l’icône et le titre que vous avez définis.

Thèmes

Les thèmes vous permettent de personnaliser le schéma de couleurs de votre contenu publié pour les modes clair et sombre. Il existe quatre thèmes au choix. Les couleurs de votre site seront directement influencées par la couleur principale et teinte que vous choisissez. Ces deux sélections affectent différentes parties de l’interface et peuvent complètement changer l’apparence et l’atmosphère de votre site.

A GitBook screenshot showing theme options

Épuré

Un thème moderne présentant de la translucidité et des éléments au style minimaliste. Votre couleur principale (ou teinte) affecte les liens et autres éléments d’interface mis en évidence.

Épuré est disponible pour tous les sites et est le thème par défaut.

Atténué

Un thème sophistiqué avec un contraste réduit entre les éléments. L’arrière-plan du site est plus marqué et se fond dans le premier plan, et certains éléments présentent un aspect inversé — le tout selon votre couleur principale (ou teinte).

Atténué est disponible pour tous les sites.

Gras (Premium et Ultimate)

Un thème à fort impact avec des couleurs marquées et des contrastes puissants. Votre couleur principale (ou teinte) sera utilisée pour l’en-tête du site, et d’autres éléments mis en évidence, comme les icônes, seront colorés en conséquence.

Audacieux n’est disponible que pour les sites Premium ou Ultimate.

Dégradé (Premium et Ultimate)

Un thème dans l’air du temps présentant un arrière-plan en dégradé et des touches de couleur. Le dégradé et les éléments mis en évidence seront colorés par votre couleur principale (ou teinte).

Dégradé n’est disponible que pour les sites Premium ou Ultimate.

Couleurs

A GitBook screenshot showing color customization

Couleur principale

La couleur principale de votre site influencera le style des éléments d’interface mis en évidence et des éléments de navigation tels que les liens, la page et la section en cours, le fil d’Ariane et les boutons principaux de l’en-tête.

GitBook ajuste automatiquement les couleurs de certains éléments pour garantir la lisibilité si le contraste avec l’arrière-plan est trop faible ou lorsqu’un système demande un contraste plus élevé.

Couleur de teinte

La couleur de teinte de votre site modifiera subtilement la couleur de tout le texte et de toutes les icônes sur l’ensemble de votre site — y compris les liens de l’en-tête, la couleur des icônes et les éléments d’interface comme la Poser une question ou effectuer une recherche barre.

La couleur de teinte ne pas affectera les éléments de navigation comme les liens et les boutons, qui utilisent toujours la couleur principale.

Dans la Couleur de teinte section, vous verrez des couleurs suggérées en fonction de votre choix de couleur principale. Vous pouvez en sélectionner une pour la prévisualiser, choisir votre couleur principale comme teinte, ou sélectionner une couleur entièrement personnalisée avec le sélecteur de couleurs.

Couleurs sémantiques (Premium et Ultimate)

Les couleurs sémantiques sont appliquées aux blocs d’indication dans votre contenu publié, et peuvent également être appliquées aux blocs de code.

Vous pouvez modifier la couleur d’arrière-plan de chaque style d’indication ; ces changements seront reflétés sur le site publié que vous personnalisez.

circle-info

Remarque : Les blocs d’indication dans l’éditeur GitBook conserveront toujours leurs couleurs standard et ne correspondront pas aux couleurs sémantiques de votre site.

Thème de code (Premium et Ultimate)

Les thèmes de code modifient l’apparence du code et des blocs API dans votre documentation publiée.

La liste des thèmes comprend :

  • Thèmes adaptatifs – Ces thèmes standard pour les modes clair et sombre utilisent la palette de couleurs de votre site pour correspondre à votre marque.

  • Shikiarrow-up-right thèmes – Choisissez parmi plus de 60 préréglages de thèmes pour les modes clair et sombre.

Vous pouvez choisir des thèmes de code distincts pour le mode clair et le mode sombre de votre documentation. Et vous pouvez utiliser n’importe quel schéma de couleurs clair ou sombre dans n’importe quel mode — par exemple, un thème de code sombre lorsque votre documentation est en mode clair.

Par défaut, le thème choisi s’appliquera à la fois aux blocs de code et aux blocs OpenAPI. Si vous souhaitez définir un thème différent pour les blocs OpenAPI, cliquez sur le bouton Personnaliser par type de bloc .

Modes

Afficher le commutateur de mode

Activez cette option si vous souhaitez que les visiteurs basculent manuellement entre le mode clair et le mode sombre. Les lecteurs peuvent trouver le commutateur en bas de n’importe quelle page publiée, sur ordinateur comme sur mobile.

Mode par défaut

Choisissez si les visiteurs voient votre contenu par défaut en mode clair ou sombre. Si Afficher le commutateur de mode est activé, ils peuvent changer de mode ; s’il est désactivé, ils ne verront que le mode que vous choisissez ici.

Remarque : pour changer le thème dans l’application GitBook, allez dans le menu Paramètres en bas de la barre latérale.

Styles du site

A GitBook screenshot showing site style settings

Famille de polices (Premium et Ultimate)

Choisissez une famille de polices standard et une police monospace pour votre contenu publié parmi une sélection soignée d’options populaires.

circle-info

Les polices monospace sont utilisées dans les blocs de code et les blocs OpenAPI de votre site de documentation.

Polices personnalisées (Ultimate uniquement)

Téléversez vos propres polices standard et monospace pour aligner votre contenu publié sur le guide de style de votre marque. Pour téléverser une police, cliquez sur Ajouter une police personnalisée et suivez les instructions. Vous devez téléverser un fichier de police pour les graisses normale et gras.

GitBook prend actuellement en charge .woff et .woff2. Pour d’autres formats, veuillez contacter support@gitbook.comenvelope.

Icônes (Premium et Ultimate)

Lors de l’utilisation des icônes de page, définissez ici le poids et le style des icônes affichées.

Style des coins

Choisissez des coins arrondis ou droits pour correspondre aux préférences de style de votre marque.

Style de profondeur

Choisissez entre deux styles de profondeur, qui s’appliquent aux cartes, aux boutons et à tout autre élément avec une ombre :

  • Subtil : Quelques ombres et une certaine élévation.

  • Plat : Aucune ombre ni élévation.

Style des liens

Choisissez entre deux styles de liens :

  • Par défaut : met en surbrillance l’intégralité du lien dans votre couleur principale ou de teinte.

  • Accent : ajoute un soulignement coloré au lien, sans modifier la couleur du texte.

Styles de la barre latérale

A GitBook screenshot showing sidebar style options
Ce menu vous donne une idée visuelle de la manière dont les différents styles modifieront l’apparence de votre barre latérale.

Style d’arrière-plan

Choisissez le style d’arrière-plan pour le conteneur de la barre latérale. La couleur est dérivée du thème sélectionné.

Il existe deux options — Par défaut et Rempli — chacune avec une représentation visuelle de la manière dont elles modifieront votre table des matières.

Style de liste

Choisissez le style pour la liste de la barre latérale et ses éléments sélectionnés. Il existe trois options — Par défaut, Pilule et Ligne — chacune avec une représentation visuelle montrant comment elles modifieront votre table des matières.

Mis à jour

Ce contenu vous a-t-il été utile ?