> ## Documentation Index > Fetch the complete documentation index at: https://www.macaly.com/docs/llms.txt > Use this file to discover all available pages before exploring further. # Design Layout, immagini, icone, foto e design visivo per il tuo progetto. *** ## Design personalizzato Mostra all'agente un'immagine, uno screenshot o uno schizzo e lui ne riprende lo stile. Sceglie font, colori, spaziature e layout in base alle indicazioni che gli dai. Per impostazione predefinita tutto è responsive su ogni dispositivo. **Come si usa** Descrivi l'aspetto che vuoi ottenere. Condividi screenshot, mood board o siti di riferimento. In qualsiasi momento puoi dire "migliora il design" per rielaborare la grafica. **Esempi di prompt:** ``` Creami una landing page per il mio SaaS di gestione delle scorte per ristoranti. Voglio un look pulito e affidabile, simile a Linear o Stripe. Sezione hero scura con un mockup del prodotto, griglia di funzionalità con icone e una tabella prezzi a tre livelli in fondo. ``` ``` Riprogetta la mia homepage usando questo screenshot di Airbnb come riferimento. Gestisco case vacanza sulla Costiera Amalfitana e voglio un layout simile ma con colori più caldi, terracotta e crema. Mantieni la barra di ricerca ben visibile e aggiungi una sezione per le nostre 6 proprietà in evidenza. ``` ``` Rielabora il mio sito per dargli un tono più premium ed editoriale. Sono uno stratega di marca per clienti della moda di lusso. Pensa a Vogue che incontra un'agenzia di alto livello. Usa grandi immagini a tutta pagina, poco testo e molto spazio bianco ovunque. ``` *** ## Creazione e modifica di immagini Descrivi un'immagine e l'agente la crea. Carica una foto e digli cosa cambiare. Carica qualsiasi cosa e chiedi di rimuovere lo sfondo. Ogni immagine riceve un link permanente. Scegli tu il formato: orizzontale, quadrato o verticale. Le modifiche possono usare più immagini insieme. Carica la foto da cambiare e fino a 13 immagini di riferimento: l'agente prende dalle referenze stile, colori o oggetti e li applica all'immagine originale. La rimozione dello sfondo produce un vero PNG trasparente, che puoi mettere su qualsiasi sfondo. **Come si usa** Descrivi come deve essere l'immagine: stile, atmosfera, colori, soggetto. Per le modifiche, carica l'immagine e spiega i cambiamenti. Quando aggiungi delle referenze, indica quale immagine va modificata e cosa prendere dalle altre. Per la rimozione dello sfondo, basta caricare l'immagine e chiederlo. **Esempi di prompt:** ``` Genera un'immagine hero per la mia landing page fintech. Voglio un gradiente astratto e fluido in tonalità di blu profondo e viola con forme geometriche discrete. Formato orizzontale, così da occupare tutta la larghezza della pagina. ``` ``` Rimuovi lo sfondo disordinato della cucina da questa foto prodotto del nostro vaso in ceramica. Sostituiscilo con uno sfondo beige chiaro e uniforme, e mantieni le ombre naturali così sembra ancora realistico. ``` ``` Crea tre illustrazioni flat per l'onboarding del mio SaaS: una per la creazione dell'account, una per la collaborazione del team su una dashboard e una per la schermata di completamento. Usa il verde acqua e l'arancione caldo come colori principali. ``` ``` Modifica la prima foto del nostro divano perché abbia la stessa luce e lo stesso pavimento in legno della seconda foto, e aggiungi accanto la pianta della terza foto. Lascia il divano esattamente com'è. ``` *** ## Icona del sito Genera una favicon per la scheda del browser. I design semplici funzionano meglio, perché le favicon sono minuscole. Pensa a forme decise, singole lettere o icone minimali. **Come si usa** Descrivi l'icona che vuoi. Indica il nome del marchio, i colori e lo stile. Più è semplice, meglio si legge alle dimensioni ridotte. **Esempi di prompt:** ``` Crea una favicon per la mia torrefazione di caffè "Ember". Fai un'icona minimale a forma di fiamma in arancione bruciato su sfondo scuro. Deve essere riconoscibile a 16x16 pixel, quindi tienila semplice. ``` ``` Genera una favicon per il mio studio di consulenza. Solo la lettera "A" in un font sans-serif pulito, testo bianco su un cerchio blu navy. Deve essere in linea con il tono professionale del resto del sito. ``` ``` Crea una favicon per la mia app di fitness "Pulse". Usa l'icona di una linea del battito cardiaco in verde brillante su nero. Qualcosa di energico e moderno, nello stile dell'icona di Strava. ``` *** ## Ricerca di foto Cerca foto stock gratuite e le aggiunge direttamente al tuo progetto. Senza costi di licenza e senza obbligo di attribuzione. Filtra per orientamento, dimensione e colore. **Come si usa** Descrivi le foto che ti servono: soggetto, atmosfera, illuminazione e dove andranno sul sito. **Esempi di prompt:** ``` Trovami 4-5 foto lifestyle per il sito di uno spazio di coworking. Mi servono scatti di persone che lavorano in uffici moderni e luminosi con luce naturale, laptop aperti e qualche scatto di collaborazione. Orizzontali per la sezione hero e ritagli quadrati per la sezione del team. ``` ``` Cerca fotografie di cibo dai toni caldi per il sito del mio ristorante a chilometro zero. Primi piani di piatti impiattati, tavoli rustici in legno e ingredienti freschi. Tonalità terrose, niente di troppo costruito o artificiale. ``` ``` Trova una foto hero per la landing page della mia startup fintech. Qualcosa di astratto e professionale. Skyline al tramonto, architettura pulita o uno sfondo discreto a tema tecnologico. Formato panoramico, tonalità blu fredde. ``` *** ## Ricerca di icone Cerca in una libreria di icone, illustrazioni ed emoji. Ottieni set coordinati nello stesso stile, invece di icone scoordinate provenienti da fonti diverse. Personalizza colori, dimensione e stile. In SVG o PNG. **Come si usa** Descrivi le icone che ti servono e dove andranno. Indica lo stile (a linee, piene, flat) e i colori. Chiedere insieme le icone correlate le mantiene coerenti. **Esempi di prompt:** ``` Trovami un set coordinato di icone a linee per la sezione funzionalità del mio SaaS: analytics, collaborazione, sicurezza, integrazioni e supporto. Tutte nello stesso stile minimale a linee, colore blu navy. ``` ``` Cerca illustrazioni colorate per l'onboarding di un'app per il benessere. Me ne serve una per ogni passaggio: creazione del profilo, definizione degli obiettivi di salute, collegamento di un dispositivo indossabile e visualizzazione del primo report. ``` ``` Dammi un set di icone piene per il footer del mio sito e-commerce: camion per la spedizione, frecce per i resi, lucchetto per il pagamento sicuro e fumetto per l'assistenza clienti. Grigio scuro, stile coerente, circa 24px. ``` *** ## Generazione di video Descrivi una scena, la presentazione di un prodotto o una breve animazione e l'agente la produce. I video generati vengono salvati direttamente tra i tuoi file, così puoi usarli ovunque nel progetto o incorporarli nella tua app. Puoi anche fornire un'immagine di riferimento come fotogramma iniziale e descrivere cosa deve succedere dopo. **Come si usa** Descrivi il video: soggetto, movimento, atmosfera, inquadratura e stile. Indica la durata (5 o 10 secondi) e l'orientamento se sono importanti. Per animare un'immagine esistente, condividila e spiega cosa deve succedere. **Esempi di prompt:** ``` Genera un video hero di 5 secondi per la landing page del mio SaaS. Una dashboard pulita in dark mode con grafici luminosi, movimento di camera fluido all'indietro, atmosfera tecnologica e futuristica. Formato orizzontale. ``` ``` Crea un video di sfondo in loop per la mia app di meditazione. Lenta ripresa aerea su una foresta di montagna nella nebbia all'alba. Blu e verdi tenui. Orientamento verticale per gli schermi dei cellulari. ``` ``` Anima questa foto prodotto della nostra boccetta di profumo in una breve clip. Deve ruotare lentamente mentre una luce dorata scorre sul vetro. Sfondo bianco pulito, 5 secondi, orizzontale. ``` This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.