Vista previa de paleta en una web
Introduce tus colores y dos fuentes y míralos aplicados en directo a páginas web de ejemplo, en modo claro y oscuro, antes de decidirte.
Sobre esta herramienta
Esta herramienta aplica tu paleta a maquetas de páginas ficticias para que la valores en un contexto real: portada de una web corporativa, tienda online, carta de restaurante, página de reservas, tarjeta de fidelidad y panel de control con gráficos. Indicas el color del texto, el fondo, el color primario, el secundario y el de acento (los tonos de tarjetas y bordes se deducen de ellos), y eliges una fuente para los títulos y otra para el texto, entre fuentes del sistema y algunas fuentes libres incluidas.
El modo oscuro se calcula a partir de tus colores, el botón «Mezclar roles» prueba otros repartos y el generador propone paletas armoniosas al azar respetando los colores que hayas bloqueado, y puedes deshacer y rehacer en cualquier momento. Los contrastes insuficientes se señalan directamente en la maqueta, según los umbrales WCAG. Comparte tu prueba con un simple enlace, exporta los colores como variables CSS, JSON o para Tailwind y descarga la maqueta en PNG. Todo ocurre en tu navegador y no se envía nada a ningún servidor.
- 6 maquetas: portada, tienda, carta, reservas, fidelidad, panel
- Modo claro y oscuro calculado automáticamente
- Paletas al azar con bloqueo, mezcla de roles, deshacer/rehacer
- Avisos de contraste WCAG en la maqueta
- Enlace para compartir con tus ajustes
- Exporta en CSS, JSON, Tailwind y PNG