Un prompt de sistema de diseño para que tu build con IA no se vea igual a todos los demás sitios de IA
De Wikiprompt, la enciclopedia libre de prompts
Un prompt de sistema de diseño para que tu build con IA no se vea igual a todos los demás sitios de IA Un sistema de diseño con nombre propio, cálido y humano, con colores, tipografías y reglas de componentes exactos, que pegás antes de pedirle a ChatGPT o Claude que construya una página, para que deje de recurrir por defecto a degradados violetas y la fuente Inter.
Contenido del PromptGuardar
🌐
Usá este sistema de diseño para todo lo que construyas. Seguilo con precisión.
ESTÉTICA: Suave, humano, cercano, calmo. Tonos cálidos, formas suavemente redondeadas, acogedor, nunca clínico.
COLORES (usá estos valores exactos como variables CSS):
- Fondo: #FBF7F2 (crema cálido, nunca blanco puro)
- Superficie: #FFFFFF
- Texto primario: #3A342E (carbón cálido)
- Texto secundario: #8A8178
- Acento: #E07856 (coral cálido)
- Acento secundario: #7BA88F (verde salvia suave)
- Borde: #EDE6DD
TIPOGRAFÍA:
- Títulos: "Fraunces" (serif, de Google Fonts), peso 600
- Cuerpo: "Source Sans 3" (de Google Fonts)
- Nunca uses Inter, Roboto, ni fuentes del sistema
- Escala tipográfica: 14 / 15 / 16 / 22 / 56px, interlineado 1.7
ESPACIADO: base de 4px. Escala: 8 / 16 / 22 / 34 / 56px. Generoso, nunca apretado.
COMPONENTES:
- Hero asimétrico: texto tranquilizador de un lado, una tarjeta funcional del otro, no centrado
- Todo redondeado: tarjetas, inputs, etiquetas (radio de 12 a 24px)
- Botones: píldora verde salvia para la navegación, coral sólido para las acciones primarias
- Etiquetas tipo píldora con un borde fino
EVITAR: violeta, gradientes, fondos blanco puro, esquinas filosas, grises fríos, azules clínicos, fuente Inter.
Después decile qué querés, por ejemplo "usando el sistema de arriba, construí una página de reservas para un masajista".
Corré esto justo después de la primera construcción para detectar si vuelve a los valores por defecto:
Auditá lo que acabás de construir en busca de señales genéricas de diseño de IA, cualquier gradiente violeta, cualquier fuente Inter o Roboto, cualquier layout de tarjetas a tres columnas, cualquier hero centrado con un solo botón debajo, cualquier texto gris de bajo contraste sobre blanco. Reemplazá lo que encuentres con opciones que coincidan con el sistema de diseño que te di.
Iniciá sesión para ver el prompt completo
Continuar con:
Al iniciar sesión, aceptás nuestros Términos de uso y Política de privacidad
Uso
Este prompt está diseñado para usarse con coding. Copiá el contenido de arriba y pegalo en tu herramienta de IA preferida.
Para mejores resultados, personalizá los marcadores (indicados con corchetes o mayúsculas) con tus requisitos específicos.
Discusión
0 comentarios