piapia123
es

Vista previa de Markdown

Texto

Todo se ejecuta en tu navegador: no se sube nada

MARKDOWN
VISTA PREVIA

El renderizado ocurre en tu navegador: el contenido no se sube. La sintaxis de imagen solo muestra el texto alternativo y nunca pide la dirección que pegaste.

Escribe a la izquierda, ve el resultado renderizado a la derecha. El renderizador implementa a propósito un subconjunto seguro: primero se escapa todo el HTML y solo después se aplica la sintaxis de Markdown, así que una etiqueta script pegada se muestra como texto y nunca se ejecuta; los enlaces con javascript: se bloquean y se muestran en rojo en vez de volverse pulsables; y la sintaxis de imagen nunca se convierte en un elemento de imagen —hacerlo obligaría a tu navegador a pedir la dirección que pegaste, avisando a ese servidor de que estás leyendo el documento—. Los títulos reciben anclas a las que saltar, y un documento con más de un título también muestra un índice arriba de la vista previa.

Funciones

  • Títulos, párrafos, negrita, cursiva, tachado, código en línea, bloques de código con resaltado de sintaxis, enlaces, listas ordenadas y no ordenadas, listas de tareas, tablas GFM, citas y reglas horizontales
  • Los títulos reciben anclas automáticamente, y un documento con dos o más títulos muestra un índice pulsable arriba
  • Los títulos en cualquier sistema de escritura —latino, chino, japonés, coreano— reciben un ancla legible en vez de un identificador numerado o vacío
  • Los bloques de código se resaltan por lenguaje (javascript, typescript, python, bash, sql, yaml, diff, dockerfile y una veintena más), cada uno con su etiqueta de lenguaje y un botón de copiar de un clic
  • Las tablas admiten alineación a la izquierda, al centro y a la derecha, y en pantallas estrechas se desplazan dentro de su propia caja en vez de romper el diseño
  • Las listas de tareas escritas como - [x] / - [ ] se renderizan con casillas
  • El HTML se escapa antes de analizarlo, así que las etiquetas pegadas siguen viéndose como texto
  • Los esquemas de enlace se filtran: javascript:, data: y similares nunca se vuelven anclas pulsables y la dirección en bruto se muestra en rojo
  • Los enlaces externos llevan rel="noopener noreferrer" contra el tabnabbing inverso
  • La sintaxis de imagen solo muestra su texto alternativo y nunca pide una dirección remota
  • Dos niveles de anidamiento de listas, con dos espacios de sangría
  • La cursiva con guion bajo se deja sin analizar a propósito, para que foo_bar_baz y __init__ queden intactos
  • El contenido de más de 200.000 caracteres se recorta con un aviso explícito

Cómo se usa

  1. Pega o escribe Markdown en el panel izquierdo
  2. El resultado renderizado aparece en el panel derecho mientras escribes
  3. En un documento largo, muévete con el índice de arriba
  4. Pulsa Cargar ejemplo para ver un documento que ejercita toda la sintaxis admitida
  5. Para enviarlo o archivarlo, usa Descargar .html: las anclas y el índice siguen funcionando en ese archivo

Preguntas frecuentes

¿Se admiten notas al pie o HTML mezclado?
Las tablas, las listas de tareas y el resaltado de sintaxis sí. Las notas al pie y el HTML mezclado no, y el HTML mezclado nunca lo estará: choca de frente con la regla de que toda entrada del usuario se escapa antes de llegar a la página, porque sería dejar que los usuarios inyectaran etiquetas. Para CommonMark completo, previsualiza en un editor local.
¿Por qué no se analiza _cursiva_?
Los guiones bajos aparecen constantemente dentro de identificadores, así que foo_bar_baz, __init__ y snake_case acabarían todos convertidos en cursiva. La forma con asterisco no tiene ese problema; usa esa.
¿Por qué no se muestran las imágenes?
Mostrar una imagen hace que tu navegador pida la dirección que pegaste. Para un documento que aún no es público, eso le dice a un servidor de terceros que lo estás leyendo, lo que contradice la promesa de que nada sale de tu navegador. Solo se muestra el texto alternativo.
¿Se fusionan los saltos de línea simples?
No. Un salto de línea simple dentro de un párrafo se mantiene como salto, igual que en los cuadros de comentarios de los sitios de código, y solo una línea en blanco abre un párrafo nuevo. Tu diseño pegado no se reescribe en silencio.
¿Cómo se construye el índice y puedo compartir el ancla de un título?
Cada título recibe un ancla, y un documento con dos o más títulos muestra un índice arriba de la vista previa; pulsar una entrada salta a esa sección. Un título en cualquier sistema de escritura conserva un ancla legible en vez de un identificador numerado o vacío, así que un título en chino o japonés sigue siendo legible en la URL. Para referenciar una sección en otro sitio, usa Descargar .html y comparte ese archivo: ahí funcionan las anclas y el índice. Pulsar una entrada del índice no cambia la barra de direcciones, porque el documento solo existe en tu máquina: un enlace a esta página no lo reproduciría para quien lo abra.

Herramientas relacionadas