# Minimal japonés (ma)

También llamado: minimalismo japonés, diseño ma, web wabi-sabi, UI zen, estilo Muji, kanso  
Época: tradicional; uso web de 2015 en adelante (Muji, estudios japoneses, marcas de té y artesanía)  
Página: https://designforai.dev/es/style/japanese-minimal

## Rasgos

- ma: el vacío es el elemento principal; el contenido ocupa una parte pequeña del lienzo
- ritmo vertical y texto vertical (writing-mode) usados con intención
- paleta natural y apagada: blanco washi, tinta sumi, un tono tierra o índigo
- tipo fino, tamaños pequeños, tracking amplio; a menudo serif Mincho combinada con una gótica ligera
- asimetría, colocación descentrada, una sola imagen con mucho espacio alrededor
- texturas de papel y materiales naturales, apenas visibles
- el movimiento es lento y silencioso: fundidos de 800ms o más, sin rebote

Paleta: #f4f1ea washi, #1c1c1c sumi, #8c8478 piedra, #2b3a55 índigo, #b7a58f arcilla, #dcd6cb línea

Tipografía: Noto Serif JP o Shippori Mincho para títulos (300-400 a 28-48px, tracking 0.08em), Noto Sans JP o Zen Kaku Gothic New para el cuerpo (300-400 a 15-16px, line-height 1.9); latino: Cormorant o EB Garamond con Geist light

## Haz

- deja vacío el 60% o más del viewport en el hero; coloca el titular descentrado
- usa writing-mode: vertical-rl en una etiqueta o elemento de nav para señalar la referencia
- mantén cada transición en 800-1200ms con ease-out; nada salta

## Evita

- no añadas tarjetas, sombras ni bordes gruesos; usa espacio en blanco y filetes finísimos
- no uses pesos en negrita; solo 300-400, jerarquía por tamaño y espaciado
- no rellenes el espacio vacío con decoración; el vacío es el diseño

Conocido por: Muji, sitio de Ryuichi Sakamoto, Nendo, Ippodo Tea, el trabajo de Kenya Hara

## Semilla CSS

```css
:root{--bg:#f4f1ea; --fg:#1c1c1c; --muted:#8c8478; --accent:#2b3a55; --line:#dcd6cb; --radius:0; --tracking:0.08em; --font:'Noto Sans JP',sans-serif; --font-display:'Shippori Mincho',serif}
```

## Prompt

Construye el sitio en estilo minimal japonés (ma). Fondo #f4f1ea, texto #1c1c1c, apagado #8c8478, un solo acento índigo #2b3a55, filetes #dcd6cb. Fuentes: Shippori Mincho 400 para títulos a 40/28/20px con letter-spacing 0.08em y line-height 1.4; Noto Sans JP 300 a 15px, line-height 1.9, para el cuerpo, max-width 34em. Hero: altura del viewport, un titular colocado al 15% desde la izquierda y al 60% desde arriba, una sola imagen pequeña (máximo 360px de ancho) colocada arriba a la derecha; al menos el 60% del hero se queda vacío. Una etiqueta de nav o el índice de sección en writing-mode: vertical-rl, posicionado en el borde derecho. Secciones separadas por 160px de espacio y un único filete 1px #dcd6cb de 80px de ancho, alineado a la izquierda. Sin tarjetas, sin sombras, sin radio, sin negrita. Los botones son texto con subrayado de 1px y tracking 0.1em. Las imágenes no llevan borde y aparecen con un fundido de 1000ms ease-out al hacer scroll. Todas las transiciones a 800ms.