Passer au contenu principal
Utilisez ces paramètres de docs.json pour contrôler l’identité visuelle de votre site de documentation : thème de mise en page, couleurs de marque, logo, typographie et arrière-plan.

Paramètres

theme - required

Le thème de mise en page de votre site. L’un des suivants : mint, maple, palm, willow, linden, almond, aspen, sequoia, luma. Voir Thèmes pour les aperçus et les détails.

name - required

Type : string Le nom de votre projet, organisation ou produit. Apparaît dans le titre de l’onglet du navigateur et à d’autres endroits de votre site.

colors - required

Type : object Les couleurs utilisées dans votre documentation. Les couleurs s’affichent différemment selon les thèmes. Si vous ne fournissez qu’une couleur principale, elle s’applique à tous les éléments de couleur.
colors.primary
string
requis
La couleur principale de votre documentation. Généralement utilisée pour la mise en évidence en mode clair, avec quelques variations selon le thème.Doit être un code hexadécimal commençant par #. Exemple : "#0D9373".
colors.light
string
La couleur utilisée pour la mise en évidence en mode sombre.Doit être un code hexadécimal commençant par #.
colors.dark
string
La couleur utilisée pour les boutons et les états de survol en modes clair et sombre, avec quelques variations selon le thème.Doit être un code hexadécimal commençant par #.
docs.json
"colors": {
  "primary": "#0D9373",
  "light": "#55D799",
  "dark": "#0D9373"
}

Type : string ou object Le logo de votre site. Fournissez un chemin d’image unique ou des images distinctes pour les modes clair et sombre.
logo.light
string
requis
Chemin vers votre fichier de logo pour le mode clair. Incluez l’extension du fichier. Exemple : /logo/light.svg.
logo.dark
string
requis
Chemin vers votre fichier de logo pour le mode sombre. Incluez l’extension du fichier. Exemple : /logo/dark.svg.
logo.href
string (uri)
L’URL vers laquelle rediriger lors d’un clic sur le logo. Si non fournie, le logo pointe vers la première page de la locale sélectionnée pour les documentations internationalisées, ou vers votre page d’accueil pour les sites monolingues. Exemple : https://yoursite.com.
docs.json
"logo": {
  "light": "/logo/light.svg",
  "dark": "/logo/dark.svg",
  "href": "https://yoursite.com"
}

favicon

Type : string ou object Chemin vers votre fichier de favicon, incluant l’extension du fichier. Redimensionné automatiquement aux tailles de favicon appropriées. Fournissez un fichier unique ou des fichiers distincts pour les modes clair et sombre.
favicon.light
string
requis
Chemin vers votre favicon pour le mode clair. Incluez l’extension du fichier. Exemple : /favicon.png.
favicon.dark
string
requis
Chemin vers votre favicon pour le mode sombre. Incluez l’extension du fichier. Exemple : /favicon-dark.png.
docs.json
"favicon": "/favicon.svg"

appearance

Type : object Paramètres du mode clair/sombre.
appearance.default
"system" | "light" | "dark"
Mode de couleur par défaut. Choisissez system pour correspondre aux paramètres de l’OS de l’utilisateur, ou light ou dark pour forcer un mode spécifique. Valeur par défaut : system.
appearance.strict
boolean
Lorsque true, masque l’interrupteur du mode clair/sombre pour que les utilisateurs ne puissent pas changer de mode. Valeur par défaut : false.
docs.json
"appearance": {
  "default": "dark",
  "strict": true
}

fonts

Type : object Polices personnalisées pour votre documentation. La police par défaut varie selon le thème. Prend en charge Google Fonts et les polices auto-hébergées.
fonts.family
string
requis
Nom de la famille de polices, comme "Inter" ou "Open Sans". Prend en charge les noms de familles Google Fonts : ces polices se chargent automatiquement sans source requis.
fonts.weight
number
Graisse de la police, comme 400 ou 700. Les polices variables prennent en charge les graisses fractionnaires comme 550.
fonts.source
string (uri)
URL vers une police hébergée ou chemin vers un fichier de police local. Non nécessaire pour les Google Fonts.
  • Hébergée : https://example.com/fonts/MyFont.woff2
  • Locale : /fonts/MyFont.woff2
fonts.format
"woff" | "woff2"
Format du fichier de police. Requis lors de l’utilisation du champ source.
fonts.heading
object
Remplace les paramètres de police uniquement pour les titres.Accepte les mêmes champs family, weight, source et format que l’objet fonts de niveau supérieur.
fonts.body
object
Remplace les paramètres de police uniquement pour le corps du texte.Accepte les mêmes champs family, weight, source et format que l’objet fonts de niveau supérieur.
docs.json
"fonts": {
  "family": "Inter",
  "heading": {
    "family": "Playfair Display"
  }
}

icons

Type : object Paramètres de la bibliothèque d’icônes. Vous ne pouvez utiliser qu’une seule bibliothèque d’icônes par projet. Tous les noms d’icônes dans votre documentation doivent provenir de la bibliothèque sélectionnée.
icons.library
"fontawesome" | "lucide" | "tabler"
requis
Bibliothèque d’icônes à utiliser dans toute votre documentation. Valeur par défaut : fontawesome.
Vous pouvez spécifier une URL vers une icône hébergée en externe ou un chemin vers un fichier d’icône dans votre projet pour n’importe quelle icône individuelle, indépendamment du paramètre de bibliothèque.
docs.json
"icons": {
  "library": "lucide"
}

background

Type : object Paramètres d’image d’arrière-plan, de décoration et de couleur.
background.decoration
"gradient" | "grid" | "windows"
Un motif d’arrière-plan décoratif pour votre thème.
background.color
object
Couleurs d’arrière-plan personnalisées pour les modes clair et sombre.
background.image
string or object
Image d’arrière-plan pour votre site. Fournissez un chemin unique ou des chemins distincts pour les modes clair et sombre.
docs.json
"background": {
  "decoration": "gradient",
  "color": {
    "light": "#F8FAFC",
    "dark": "#0F172A"
  }
}

styling

Type : object Contrôles de style visuel avancés.
styling.eyebrows
"section" | "breadcrumbs"
Le style de l’eyebrow de la page (le libellé affiché en haut de la page). Choisissez section pour afficher le nom de la section ou breadcrumbs pour afficher le chemin de navigation complet. Valeur par défaut : section.
styling.latex
boolean
Contrôle si les feuilles de style LaTeX se chargent. Par défaut, Mintlify détecte automatiquement l’utilisation de LaTeX dans votre contenu et charge les feuilles de style nécessaires.
  • Définissez sur true pour forcer le chargement des feuilles de style LaTeX lorsque la détection automatique échoue.
  • Définissez sur false pour empêcher le chargement des feuilles de style LaTeX et améliorer les performances si vous n’utilisez pas d’expressions mathématiques.
styling.codeblocks
"system" | "dark" | string | object
Thème des blocs de code. Valeur par défaut : "system".
  • "system" : Correspond au mode actuel du site (clair ou sombre)
  • "dark" : Utilise toujours le mode sombre
  • Un nom de thème Shiki sous forme de chaîne : applique ce thème à tous les blocs de code
  • Un objet avec les clés light et dark : applique des thèmes Shiki distincts par mode

thumbnails

Type : object Personnalisation des vignettes pour les réseaux sociaux et les aperçus de page.
thumbnails.appearance
"light" | "dark"
Thème visuel pour les vignettes. Si non défini, les vignettes utilisent le jeu de couleurs de votre site défini par colors.
thumbnails.background
string
Image d’arrière-plan pour les vignettes. Peut être un chemin relatif ou une URL absolue.
thumbnails.fonts
object
Configuration des polices pour les vignettes. Prend uniquement en charge les noms de familles Google Fonts.

Exemple

docs.json
{
  "$schema": "https://mintlify.com/docs.json",
  "theme": "maple",
  "name": "Example Co.",
  "colors": {
    "primary": "#3B82F6",
    "light": "#93C5FD",
    "dark": "#1D4ED8"
  },
  "logo": {
    "light": "/logo/light.svg",
    "dark": "/logo/dark.svg",
    "href": "https://example.com"
  },
  "favicon": "/favicon.svg",
  "appearance": {
    "default": "system"
  },
  "fonts": {
    "family": "Inter"
  },
  "icons": {
    "library": "lucide"
  },
  "background": {
    "decoration": "gradient"
  }
}