Six Rules for Designing with AI: A Prompting Guide
MagicPath Team
Team
The gap between a mediocre AI-generated design and a stunning one almost always comes down to how you prompt. After watching thousands of MagicPath users build everything from landing pages to complex dashboards, we've distilled the patterns that consistently produce the best results.
Rule 1: Be specific, not vague
The AI cannot read your mind. The more precise your description, the closer the output matches your vision on the first try — saving credits and iteration time.
Vague prompt:
"Make a nice landing page"
Specific prompt:
"Create a SaaS landing page with a hero section featuring a large headline, subheading, and two CTA buttons. Include a features grid with 6 cards, a testimonials carousel, pricing with 3 tiers, and a dark footer."
Notice the difference: the specific prompt names every section, describes the layout, and tells the AI exactly what elements to include. This gives the model far less room for interpretation — which is exactly what you want for your first generation.
Rule 2: Always upload a reference image
This is the single most impactful thing you can do. The AI can match visual styles, layouts, and color palettes from images far more accurately than from text descriptions alone.
What works as a reference:
- -Screenshots of websites you admire
- -Figma mockups or wireframes
- -Rough sketches on paper or a whiteboard
- -Even photos from your phone — sticky notes, napkin drawings, anything
You can also drag images directly onto the MagicPath canvas and use them as references by mentioning them with @ in chat. The AI will analyze the visual and match its style.
Rule 3: Use Prompt Styles for instant direction
MagicPath includes 32 curated design aesthetics — from Monochrome and Bauhaus to Glassmorphism and Cyberpunk. Each one injects a detailed design philosophy into your prompt, guiding the AI on typography, color palette, spacing, and overall feel.
Click the paintbrush icon in the chat toolbar, pick a style, and every component you generate will follow that visual language. You can filter by light/dark mode and font type (serif, sans-serif, mono).
Rule 4: Break complex edits into steps
If you request many changes at once, the AI may miss some. Instead of a single massive instruction, break it into focused steps and iterate:
Instead of one big prompt:
"Change the header to blue, make the buttons rounded, add a shadow to the cards, increase spacing, change the font to Inter, and add a gradient background"
Try three focused steps:
1. "Change the color scheme to use blues and add rounded buttons"
2. "Add subtle shadows to the cards and increase section spacing"
3. "Switch the font to Inter and add a gradient background"
Rule 5: Use version history as your safety net
MagicPath automatically saves every version of your design. If an edit goes wrong, you can instantly revert to any previous state. This means you can experiment freely — try bold changes, knowing you can always go back.
Rule 6: Mention existing components with @
One of MagicPath's most powerful features is the @ mention system. When you type @ in the chat, you can reference any component, image, or library element on your canvas. The AI uses that reference as context.
Use mentions to:
- -Build a new component that matches the style of an existing one: "Create a pricing section that matches the style of @HeroSection"
- -Combine multiple references: "Build a dashboard using the header from @NavBar and the card style from @MetricsCard"
- -Use an image as reference: "Recreate this layout from @screenshot.png"
The prompt structure that works
[Action] + [What] + [Details] + [Style reference]
Examples:
"Create a pricing page with three tiers (Free, Pro, Enterprise), each in a card with a features list, price, and CTA button. Use a dark theme with purple accents, similar to Linear's pricing."
"Build an analytics dashboard with a top nav, sidebar, three metric cards, a line chart, and a data table. Modern, minimal, light background."
"Design a mobile app onboarding flow with 3 screens: welcome, feature highlights, and sign-up. Use illustrations and a friendly, rounded style."
Being succinct can help drive down credit cost, but also gives the AI more room to cook. If you want to be exploratory, be intentionally vague — at your own peril.