Marco (Frame)

Frame envuelve imágenes y demos en un contenedor con borde y leyendas opcionales.

Las capturas de pantalla muestran la interfaz en inglés.

Las capturas de pantalla en esta página pueden mostrar la interfaz en inglés.

Usa Frame cuando quieras:

• Dar a las capturas de pantalla e imágenes de interfaz un aspecto acabado
• Añadir leyendas para explicar lo que los lectores están viendo
• Distinguir la salida de una demo del contenido regular
• Crear consistencia visual en toda tu documentación

Uso

<Frame caption="Architecture diagram">

  ![Diagram](/images/city-skyline.jpg)

</Frame>

Frame básico

<Frame>

  ![City skyline](/images/city-skyline.webp)

</Frame>

Con leyenda

Añade una leyenda debajo del marco:

<Frame caption="New York City at dusk">

  ![City skyline](/images/city-skyline.webp)

</Frame>

Enmarcando otro contenido

Frame funciona con cualquier contenido, no solo imágenes:

✓ Build completed successfully
✓ 42 pages generated
✓ Deployed to production

Cuándo NO usar Frame

• Imágenes decorativas en línea - Las imágenes Markdown regulares son adecuadas para ilustraciones
• Iconos o gráficos pequeños - Frame añade peso visual innecesario
• Imágenes que fluyen con el texto - Frame crea una ruptura visual; úsalo para elementos visuales independientes

Mejores prácticas

• Mantén las leyendas concisas - Una frase que explique lo que el lector está viendo
• Úsalo de forma consistente - Si enmarcar una captura de pantalla, enmarca todas las capturas para consistencia visual
• No abuses del enmarcado - Reserva los marcos para elementos visuales importantes, no para cada imagen de la página

Props

¿Qué sigue?