Fuentes

Configura fuentes personalizadas

Configura una fuente personalizada para todo tu sitio o por separado para los encabezados y el cuerpo del texto. Usa Google Fonts, archivos de fuentes locales o fuentes alojadas externamente. La fuente predeterminada varía según el tema.

Las fuentes se controlan mediante la propiedad fonts en tu docs.json.

​

Google Fonts

Mintlify carga automáticamente Google Fonts cuando especificas una familia tipográfica en tu docs.json.

docs.json

"fonts": {
  "family": "Inter"
}

​

Fuentes locales

Para usar fuentes locales, coloca los archivos de fuente en el directorio de tu proyecto y refiérelos en la configuración de docs.json.

​

Configurar fuentes locales

1. Agregar archivos de fuentes a tu proyecto

   Por ejemplo, crea un directorio fonts y agrega tus archivos de fuentes:

   your-project/
   ├── fonts/
   │   ├── InterDisplay-Regular.woff2
   │   └── InterDisplay-Bold.woff2
   ├── docs.json
   └── ...
   

2. Configurar las fuentes en docs.json

   Hace referencia a tus fuentes locales usando rutas relativas desde la raíz de tu proyecto:

   docs.json

   {
     "fonts": {
       "family": "InterDisplay",
       "source": "/fonts/InterDisplay-Regular.woff2",
       "format": "woff2",
       "weight": 400
     }
   }
   

​

Fuentes locales para títulos y cuerpo

Configura fuentes locales por separado para los títulos y el texto del cuerpo en tu docs.json:

docs.json

{
  "fonts": {
    "heading": {
      "family": "InterDisplay",
      "source": "/fonts/InterDisplay-Bold.woff2",
      "format": "woff2",
      "weight": 700
    },
    "body": {
      "family": "InterDisplay",
      "source": "/fonts/InterDisplay-Regular.woff2",
      "format": "woff2",
      "weight": 400
    }
  }
}

​

Fuentes alojadas externamente

Utiliza fuentes alojadas externamente haciendo referencia a la URL de la fuente en tu docs.json:

docs.json

{
  "fonts": {
    "family": "Hubot Sans",
    "source": "https://mintlify-assets.b-cdn.net/fonts/Hubot-Sans.woff2",
    "format": "woff2",
    "weight": 400
  }
}

​

Referencia de configuración de tipografías

fonts · object

Configuración de tipografías para tu documentación.

Mostrar Tipografías

family · string · required

Nombre de la familia tipográfica, como “Inter” o “Playfair Display”.

weight · number

Grosor de la tipografía, como 400 o 700. Las tipografías variables admiten grosores precisos como 550.

source · string (uri)

URL de la fuente tipográfica, como https://mintlify-assets.b-cdn.net/fonts/Hubot-Sans.woff2, o ruta a tu archivo de tipografía local, como /assets/fonts/InterDisplay.woff2. Google Fonts se cargan automáticamente cuando especificas un nombre de family de Google Fonts, por lo que no se necesita una URL de source.

format · 'woff' | 'woff2'

Formato del archivo de tipografía. Obligatorio cuando se usa el campo source.

heading · object

Anula la configuración de tipografía específicamente para los encabezados.

Mostrar Encabezado

family · string · required

Nombre de la familia tipográfica para los encabezados.

weight · number

Grosor de la tipografía para los encabezados.

source · string (uri)

URL de la fuente tipográfica, como https://mintlify-assets.b-cdn.net/fonts/Hubot-Sans.woff2, o ruta a tu archivo de tipografía local para los encabezados. Google Fonts se cargan automáticamente cuando especificas un nombre de family de Google Fonts, por lo que no se necesita una URL de source.

format · 'woff' | 'woff2'

Formato del archivo de tipografía para los encabezados. Obligatorio cuando se usa el campo source.

body · object

Anula la configuración de tipografía específicamente para el texto del cuerpo.

Mostrar Cuerpo

family · string · required

Nombre de la familia tipográfica para el texto del cuerpo.

weight · number

Grosor de la tipografía para el texto del cuerpo.

source · string (uri)

URL de la fuente tipográfica, como https://mintlify-assets.b-cdn.net/fonts/Hubot-Sans.woff2, o ruta a tu archivo de tipografía local para el texto del cuerpo. Google Fonts se cargan automáticamente cuando especificas un nombre de family de Google Fonts, por lo que no se necesita una URL de source.

format · 'woff' | 'woff2'

Formato del archivo de tipografía para el texto del cuerpo. Obligatorio cuando se usa el campo source.