La capa entrega el tema como archivos que puedes ensombrecer. Tres niveles, del
menor al mayor — y el menor que resuelva el problema es el correcto, porque un
componente que reemplazas es un componente que ahora mantienes.

## Pasos

:::steps
1. **Un color: redefine el token.** La paleta es el conjunto neutro de shadcn
   como variables CSS. Redefine una en tu propia hoja de estilos; no hace falta
   bifurcar el archivo de la capa.

   ```css [app/assets/css/main.css]
   :root {
     --primary: oklch(0.55 0.2 265);
   }
   .dark {
     --primary: oklch(0.7 0.18 265);
   }
   ```

   Importan los dos bloques: el tema conmuta con una **clase** `dark`, no con
   una media query, así que un token definido una sola vez está mal en uno de
   los dos modos.

   ::callout{type="warning" title="Comprueba el contraste que acabas de cambiar"}
   `--muted-foreground` lleva las descripciones de página, la tabla de
   contenidos y la miga de pan. El valor de la capa es deliberadamente más
   oscuro que el de shadcn por defecto, que mide por debajo de 4,5:1 sobre las
   superficies en las que este token aterriza de verdad.
   ::

2. **Una pieza del diseño: crea el archivo.** Nuxt resuelve primero tu
   componente del mismo nombre, así que reemplazar `DuxtFooter` es crear
   `app/components/DuxtFooter.vue` en tu proyecto. Los nombres, props y slots
   están en la [referencia de componentes](/reference/components) — un nombre
   documentado forma parte de la superficie pública, así que no se renombrará
   sin una versión mayor.

3. **Un slot, donde lo haya.** `DuxtPageFeedback` emite `feedback` y expone su
   estado a través de un slot, de modo que puedes colgarle tu propio formulario
   sin reemplazar el componente — desarrollado en
   [Recoger opiniones de página](/guides/collect-page-feedback).

4. **Una primitiva nueva: usa la CLI.** La capa posee sus componentes de
   shadcn-vue en lugar de importarlos, y `components.json` ya apunta la CLI al
   alias correcto:

   ```bash
   pnpm dlx shadcn-vue@latest add tooltip
   ```

5. **Un componente para Markdown.** Todo lo que esté en
   `app/components/content/` se puede invocar desde una página con la sintaxis
   de bloque MDC. Tu propio archivo del mismo nombre reemplaza el de la capa —
   véase la [referencia MDC](/reference/mdc-components).

:::

## Lista de comprobación

- [ ] No se copió nada de la capa que un token pudiera haber cambiado
- [ ] Cada token redefinido tiene valor para claro y para oscuro
- [ ] Los componentes reemplazados se llaman exactamente como los nombra la
      referencia
- [ ] `pnpm build` sigue representando todas las páginas (un override es donde
      se rompe el SSR)