Edita colores, calcula contrastes reales y exporta tokens coherentes en CSS y JSON. Medios PopNow opcionales, con presupuesto API USD aprobado tras la cotización. El contraste no sustituye una auditoría completa de accesibilidad.
- Usa PopNow para
- Imágenes
- Requiere
- Node.js
El skill es gratis. Las imágenes, el video o el sonido con IA opcionales se presupuestan para tu aprobación antes de generarse. Las llamadas con clave API usan tu saldo API independiente en dólares estadounidenses (USD); la generación desde ChatGPT o Claude conectado por OAuth/MCP usa tus créditos del sitio web.
v1.0.0 · Actualizado el 24 oct 2026 · 40 KB · Úsalo en trabajos personales y para clientes; por favor, no revendas ni compartas el paquete.
Qué obtienes
Edita colores, calcula contrastes reales y exporta tokens coherentes en CSS y JSON.
HTML independiente con datos y código fuente editables
Validación local, datos de ejemplo y comprobaciones ejecutables
Medios PopNow opcionales, con presupuesto API USD aprobado tras la cotización
Ideal para
- Revisión de paletas, componentes y entrega de tokens
- Equipos que necesitan revisar, exportar y entregar resultados sin conexión
No es para
- El contraste no sustituye una auditoría completa de accesibilidad.
- Servicios con servidor en tiempo real, cuentas o sincronización compartida
Cómo usarlo
Tú dices
Usa el skill de PopNow «Muestra de sistema de diseño» (design-system-showcase) para esto: Crea «Muestra de sistema de diseño» con mis datos reales y entrega resultados verificables y archivos editables.
Luego prueba
Comprueba los casos límite y explica los campos rechazados.
Adapta el diseño a nuestra marca y cotiza los medios PopNow antes de crearlos.
Qué tener a mano
- Colores hexadecimales de seis dígitos, radios y espacios para fondos, textos y botones.
- Público, etiquetas definitivas y destino de publicación
- Recursos propios y pruebas de las afirmaciones públicas
Skills similares
Ver todos →- Web
Plantilla de web para marca de bebidas
+25Web soleada para marca de bebidas o snacks con tienda, configurador de packs, mapa de puntos de venta y pago de demostración.
- Web
Web de producto de hardware
+25Nombres de modelo enormes y finos sobre fotos de estudio plateadas y tarjetas de especificaciones.
- Web
Plantilla web de tienda de zapatillas
+25Una tienda completa de calzado o ropa con catálogo, páginas de producto, cesta y checkout de demostración en un único HTML.
- Web
Web para diseñador freelance
+25Web atrevida de estudio de una persona que vende paquetes de precio fijo, con páginas de plan, casos de estudio y formulario de encargo.
- Web
Plantilla de web para agencia de viajes
+25Web centrada en la foto para excursiones, guías o refugios, con búsqueda de viajes, solicitudes de reserva y cuestionario de viaje.
- Web
Plantilla web de glassmorphism
+25Píldoras de cristal esmerilado sobre fondo casi negro, titular serif enorme y captura de correo.
- Web
Creador de avatares 3D
+25Crea un adorable personaje 3D de peluche en tu navegador y guárdalo como PNG transparente o como página 3D.
WebWeb de CV académico
+25Organiza investigación, docencia y servicio con filtros de publicaciones y exportación BibTeX.
- Web
Mapa de calor de calendario
+25Un año de actividad diaria en una cuadrícula de calendario sombreada, con rachas, totales y acceso por teclado.
WebWeb de productos agrícolas
+25Filtra equipos por cultivo y región, compara especificaciones y prepara consultas técnicas.
- Web
Landing page de SaaS con IA
+25Papel arena cálido y guías finas alrededor de un tablero kanban en vivo donde un asistente planifica tareas.
- Web
Sección hero animada
+25Un hero de landing page con una palabra del titular que rota suavemente, dos botones y un marco ancho para imagen.
WebPortafolio de arquitectura
+25Filtra proyectos, cambia las unidades de superficie e imprime una selección.
WebSitio web de productos de audio
+25Compara especificaciones y escucha tus archivos en una prueba A/B real y local.
WebAnalizador de espectro de audio
+25Analiza audio local con espectro real, frecuencia dominante y nivel de señal.
WebPlantilla web de casos de estudio
+25Vincula pruebas e indicadores, verifica cambios y señala los datos que faltan.
WebPanel de flujo de caja
+25Concilia saldo inicial, entradas y salidas con un saldo calculado por transacción.
WebSitio de marketing para CMS
+25Edita artículos JSON, valida sus campos, previsualiza y exporta contenido válido.
WebPágina para ponentes
+25Busca charlas por tema y duración, y exporta la presentación y los requisitos técnicos.
WebPlantilla web para constructoras
+25Calcula cantidades y precios unitarios, separa la contingencia y exporta el presupuesto.
WebPlantilla web de consultoría
+25Compara servicios por objetivo, plazo y tamaño del equipo, y exporta un resumen.
WebPanel de conversión
+25Calcula conversiones y abandonos por etapa de una misma cohorte, con una tabla verificable.
- Web
Web de agencia creativa con héroe shader
+25Un héroe shader vivo en naranja tras un titular anclado abajo, navegación en píldora y casos en cuadrícula.
WebPortal de incorporación de clientes
+25Guía pasos dependientes con responsables, progreso ponderado y una lista exportable.
- Web
Landing page SaaS oscura
+25Una web de marketing oscura y llena de movimiento para un producto de software, entregada como un único archivo HTML autónomo.
- Web
Web de portafolio para diseñadores
+25Seis tarjetas inclinadas flotan alrededor de un titular que se desvanece, con una tarjeta de retrato roja.
WebDiario de desarrollo
+25Crea un diario técnico buscable con código legible y un feed RSS exportable.
- Web
Web de portfolio para desarrolladores
+25Una web personal oscura para ingenieros con casos de estudio, artículos, charlas, currículum y formulario de contacto.
WebPágina de destino para libros digitales
+25Lee capítulos originales, ajusta el tamaño del texto y guarda el progreso localmente.
WebTabla de presupuesto editable
+25Recalcula previsión, gasto real y saldo al editar cantidades y precios unitarios.
- Web
Web SaaS de estilo editorial
+25Héroe dividido en azul marino, titular serif junto a una foto documental y un acento cobalto.
WebGráfico de asistencia
+25Compara inscripciones, entradas y aforo con tasas ponderadas y ausencias explícitas.
WebPlantilla de sitio para eventos
+25Filtra sesiones, detecta horarios superpuestos y exporta una agenda personal.
WebComparador de experimentos
+25Compara conversiones, muestras e intervalos de Wilson sin proclamar un ganador.
WebPortal de informes financieros
+25Busca informes por año y tipo, compara indicadores y exporta datos.
WebPrototipo de buscador de vuelos
+25Filtra vuelos locales por ruta, fecha y viajeros y compara precio total, duración y escalas.
- Web
Diagrama de arquitectura interactivo
+25Un diagrama de sistema offline y clicable, creado a partir de un modelo JSON validado, con la evidencia detrás de cada caja.
- Web
Héroe con cuadrícula interactiva
+25Una cuadrícula oscura de hilos finos que se inclina hacia el cursor y lanza un anillo luminoso con cada clic.
WebSitio web de diseño de interiores
+25Crea un encargo exportable con las medidas, el presupuesto y las prioridades de una habitación.
WebSitio web para joyerías
+25Comprueba materiales, tallas y variantes disponibles, y exporta una lista de consultas.
- Web
Explorador de grafos de conocimiento
+25Convierte notas de proyecto en un grafo offline y con búsqueda donde cada afirmación enlaza con su línea de origen.
- Web
Plantilla de panel de KPIs
+25Cuatro KPIs con indicadores de cambio, gráfico de líneas, desglose y barras de objetivo.
- Web
Landing page desde maquetas de IA
+25Ve tres diseños de página completa primero, elige uno y tu agente lo construye como código limpio y adaptable.
WebLista de espera con referidos
+25Prueba códigos estables y una cola local en una demostración identificada claramente.
WebPlantilla web para despachos jurídicos
+25Crea una lista imprimible para preparar una consulta según el servicio y la jurisdicción.
- Web
Plantilla web para revistas
+25Una web de revista con calidad de imprenta, con artículos, temas, una pequeña tienda y suscripciones, en un único archivo HTML.
WebCalculadora de precios de membresía
+25Calcula costes exactos por personas, periodo y extras, y compara planes.
WebSitio de campaña sin fines de lucro
+25Muestra la meta y los supuestos de coste, y filtra voluntariados por duración.
WebPágina de destino para cursos en línea
+25Revisa los requisitos, explora el temario y calcula un plan de estudio semanal.
WebPanel de operaciones
+25Ordena tareas por prioridad, responsable y fecha con transiciones de estado explícitas.
- Web
Héroe con animación de partículas
+25Texto sobre papel cálido junto a una esfera de puntos que cambia con cada idea.
- Web
Web de marca personal
+25Retrato fundido con papel cálido bajo un corchete fino, con afirmaciones a cada lado.
- Web
Plantilla de web para tienda de mascotas
+25Tienda de mascotas funcional: catálogo, variantes, bolsa, planificador de recargas y pago de demo en un solo archivo HTML.
WebPortafolio fotográfico
+25Organiza series con visor de teclado y hoja de contactos imprimible.
- Web
Plantilla de web para podcast
+25Web de podcast con un hero reproducible, archivo de episodios, páginas de invitados y un reproductor que sigue sonando.
WebSección de precios dibujada a mano
+25Tabla de precios al estilo cuaderno, con tarjetas de tinta inclinadas, conmutador anual y modo oscuro, en un solo archivo sin conexión.
WebDirectorio de integraciones de producto
+25Busca por función y autenticación, y crea una lista de pasos de configuración.
- Web
Página de lanzamiento de producto cinematográfica
+25Página oscura con iluminación de cine: titular serif, escena nocturna y formulario de reserva.
WebPlantilla de sitio inmobiliario
+25Filtra propiedades por presupuesto y dormitorios e imprime una comparación.
- Web
Web para artículo de investigación
+25Página de proyecto para tu artículo con una Figura 1 interactiva, resultados, limitaciones y cita con un clic.
WebPanel de mezcla de ingresos
+25Compara importes y porcentajes por categoría con totales conciliados en cada período.
WebInforme de ingresos
+25Muestra ingresos, variaciones y medias móviles, señalando los días sin datos.
- Web
Plantilla de dashboard de administración
+25Una consola de back office funcional con gráficos, tablas, kanban y calendario, en un único archivo HTML offline.
- Web
Plantilla de landing page SaaS
+25Una web de marketing tranquila y luminosa para un producto de software, con consola de producto funcional, precios y registro.
- Web
Web de portfolio estilo scrapbook
+25Un CV online de varias páginas hecho con objetos de papel, con casos de estudio y un currículum imprimible.
WebTabla de registros buscable
+25Convierte CSV en una tabla con búsqueda, orden numérico, paginación y exportación segura.
WebPanel de estado de servicios
+25Distingue salud, incidencias y comprobaciones caducadas en una instantánea documentada.
- Web
Plantilla de web para club deportivo
+25Web de club, gimnasio o estudio con horario, páginas de entrenadores, membresías, plano de pistas y reservas en un solo archivo.
- Web
Sección de muro de testimonios
+25Un muro de citas de clientes en mampostería o con deriva lenta, que solo publica citas que las personas han autorizado.
WebWeb de itinerarios de viaje
+25Organiza actividades, detecta solapamientos y tiempos de traslado y suma costes conocidos.
WebPortafolio de casos UX
+25Explica decisiones y restricciones con pruebas, separando resultados observados y propuestas.
- Web
Landing page de automatización de flujos
+25Página grafito, titular pequeño y un grafo de nodos en vivo que ejecuta, reintenta y transmite registros.
WebPortafolio para escritores
+25Busca textos por publicación y tema, guarda una lista de lectura y exporta una biografía.
Preguntas
¿Qué datos debo preparar?
Colores hexadecimales de seis dígitos, radios y espacios para fondos, textos y botones.
¿Cuáles son sus límites?
El contraste no sustituye una auditoría completa de accesibilidad.
¿Funciona sin clave API?
Sí. La plantilla, validación y exportación funcionan localmente sin clave. Solo los medios PopNow opcionales requieren cotización y aprobación explícita de un presupuesto API USD.
¿Cómo guardo los cambios?
Exporta el JSON actual antes de cerrar la página. El archivo local no se sincroniza automáticamente con un servidor.