Escrito en Markdown puro
---
title: Code Blocks
---
```ts title="livemark.config.ts"No se interpone en tu camino
Sin estructura de carpetas obligatoria, sin ataduras. Livemark se adapta a tu repo, no al revés.
Cualquier estructura de archivos
Apunta los globs de
includeal Markdown que ya tienes. README, CONTRIBUTING y CHANGELOG también se convierten en páginas.Páginas reales de TanStack Start
Coloca un archivo
.tsxen.livemark/routes/para precios, paneles o lo que quieras. Esta página de inicio es una de ellas.Tailwind, totalmente personalizable
Construido sobre Tailwind v4 y primitivas al estilo shadcn. Cambia el estilo con tokens CSS, usa utilidades en tus propias páginas o sobrescribe cualquier componente en
.livemark/.
.livemark/
└─ routes/
├─ pricing.tsx
└─ dashboard.tsx
guides/
├─ setup.md
└─ faq.md
src/
README.md
CHANGELOG.md
livemark.config.tsBonito por defecto
Markdown enriquecido, una experiencia móvil cuidada y valores por defecto sensatos. Personaliza solo lo que quieras.
Resaltado de sintaxis con Shiki
Más de 100 lenguajes, temas Catppuccin, diffs, líneas resaltadas y pistas de tipos con TwoSlash, listos para usar.
Diagramas y matemáticas
Diagramas de flujo con Mermaid y ecuaciones con KaTeX, adaptados al tema y sin configuración. Solo escríbelos en tu Markdown.
Sintaxis Markdown enriquecida
Avisos, pestañas, pasos, tarjetas, árboles de archivos e insignias como directivas simples, y componentes MDX cuando necesites más.
Sitios multilingües
Traduce cualquier página con un archivo hermano. Textos de interfaz para 7 idiomas, selector de idioma y etiquetas hreflang.
Perfecto en móvil
Navegación en hoja inferior, el contenido de la página a un toque y sin desplazamiento lateral en ningún teléfono.
Documentación, blog y changelog
Varias secciones de contenido con etiquetas, fechas e índices generados automáticamente, todo desde la configuración.
Búsqueda y navegación
Búsqueda de texto completo con Orama, barras laterales por sección, atajos de teclado y una tabla de contenidos inteligente.
Modo oscuro y tokens de tema
Modo oscuro integrado, variantes de imagen clara y oscura, variables CSS como --primary y temas de Shiki intercambiables.
Vista previa al instante, salida estática
Los cambios aparecen en el navegador al guardar, sin recargar. Después, un build estático con sitemap, robots y RSS.
Escribe Markdown. Publica un sitio web.
Tus archivos .md se quedan como están: Livemark hace el resto.
---
title: Quickstart
icon: rocket
---
# Quickstart
Install the package:
```bash
npm install livemark
```
:::tip
Run livemark dev and open the browser.
:::
## Features
- **Fast** rebuilds with Vite
- **MDX** components when you need them
- _Beautiful_ out of the boxQuickstart
Install the package:
Run livemark start and open the browser.
Features
- · Fast rebuilds with Vite
- · MDX components when you need them
- · Beautiful out of the box
Listo para agentes de IA
Cada build publica tu sitio en los formatos que buscan los agentes de IA, junto al HTML para las personas. Sin configuración.
$ curl -H "Accept: text/markdown" \
livemark.dev/introduction/
HTTP/2 200
content-type: text/markdown
# Introduction
> Learn how to set up your
> first Livemark project.
## What you get
- **Just write Markdown.**
GitHub-flavored Markdown works out
of the box, with footnotes and gemoji.
:::tip
Every page has a twin like this one —
list them all at /llms.txt.
:::Un gemelo en Markdown de cada página
Cada página tiene un
index.mdjunto a su HTML, enlazado desde el head de la página. Una regla de CDN lo sirve a las peticiones que envíanAccept: text/markdown.llms.txt listo para usar
Un índice
llms.txtde todos los gemelos, agrupado por sección y anunciado en una cabeceraLinkde la página de inicio.Señales de contenido
robots.txtindica si tus páginas pueden usarse para búsqueda, respuestas de IA o entrenamiento de modelos. Una opción de configuración lo cambia.Skills para agentes
Apunta
skillsa tus archivosSKILL.mdy se publican en/.well-known/agent-skills/.Skills para tu agente de código
npx skills add https://livemark.devenseña a Claude Code, Cursor o Codex a escribir, configurar y personalizar tu sitio Livemark.
Tu sitio web, el Markdown de Livemark
¿Ya tienes una app con Vite y React? Renderiza Markdown en ella con el mismo pipeline y los mismos componentes, sin adoptar Livemark.
Un solo plugin de Vite
Añade
@livemark/vitee importa cualquier archivo.mdo.mdxcomo componente de React, con su frontmatter y su tabla de contenidos.Los mismos componentes
Avisos, pestañas, tarjetas, bloques de código con Shiki, Mermaid y KaTeX se ven igual que en un artículo de Livemark. Sustituye cualquiera en un renderizado.
Con el estilo de tu Tailwind
Un
@importlleva los estilos de Markdown a tu build de Tailwind v4, con tus propios tokens de tema.
import markdown from "@livemark/vite"
import { defineConfig } from "vite"
export default defineConfig({
plugins: [markdown()],
})import Post from "./post.md"
export function PostPage() {
return <Post />
}Empieza a escribir. Deja que Livemark se encargue del resto.
Apunta Livemark al Markdown que ya tienes, añade páginas cuando las necesites y despliega. Esa es toda la configuración.