Stitch Website Design Prompts: SaaS and Portfolio Briefs
Stitch is Google’s AI design tool. Start with a specific website concept and make the difference between design and working behavior explicit. The exercises below describe fictional pages; they are suggested inputs, not results from a Neruve integration or a Stitch test.
Reviewed on 8 October 2026. Check the linked official documentation for your installed tool version.
Build on a working page
Preview a working HTML page, then use its source and paired prompt to apply these techniques with your coding agent.
Framewise — AI Product Landing Page HTML Template
Practice a clear product story, visual hierarchy and responsive hero.
Preview templateAstraform — Creative Agency HTML Template
Apply typography and motion to selected work and studio services.
Preview templateSkills stay free to read and copy without signing in. Template previews are public; source downloads and paired prompts require an account and the applicable purchase or plan. View source access and pricing
Give Stitch a specific website task
Write the audience, page goal, section order and primary action before choosing decorative details. Supply real copy and permitted assets where available; label placeholders. Decide whether you need a landing page, portfolio or supporting screen, so one request does not mix several unrelated journeys.
SaaS landing page prompts with a clear offer
Explain the problem, a realistic product example and the sequence that shows how it works. Use only verified features and commercial facts. The Fieldnote exercise uses a fictional research note and a workflow link instead of imaginary testimonials, customer counts or a working signup form.
Portfolio prompts with project evidence
Give each project a role, constraint and illustrative outcome. Keep the project explanation beside its image on mobile. Use placeholder labels when media is missing. The Mira example is a fictional website portfolio; it is not a résumé, Notion template or an endorsement by a real designer.
Refine mobile, then inspect the implementation
Ask for one named section to change and preserve the chosen direction elsewhere. Check narrow-screen reading order, wrapping and control labels. After moving the concept into a website project, verify actual navigation, forms, responsive layouts and content. A visual concept alone does not establish production behavior.
Original exercises you can adapt
These original Neruve examples remain in English. They are proposed inputs, not tested tool outputs or paid template prompts. Replace the fictional facts before using them.
A SaaS website concept
Design a website concept for Fieldnote, a fictional research-notes workspace.
Audience: small product teams. The page explains collect → compare → decide.
Create a warm-paper and ink direction with one realistic, clearly fictional note.
Sections: compact introduction, note specimen, three-step workflow and a final
link to the workflow. The primary action reads “Explore the workflow”.
Keep typography and button treatments consistent across the screens.
Create desktop and narrow-screen variants with readable copy and no horizontal
overflow. Do not add signup forms, prices, logos, testimonials or user counts.
This is a visual concept. Identify which interactions need implementation later.A portfolio website concept
Create a website concept for Mira Chen, a fictional product designer.
Show three explicitly fictional projects. Each explains role, constraint and
illustrative outcome without fabricated business metrics or employer logos.
Use a restrained warm-neutral direction, clear project hierarchy and readable
image captions. The primary action is “View selected work”.
Show desktop and narrow-screen layouts; on mobile, keep project details near
their corresponding image. Use placeholder media labelled as placeholder.
Do not invent real contact details, awards or working application forms.A focused mobile refinement
Refine only the mobile project section in this concept.
Keep the selected palette, typography, project order and desktop direction.
At 390 px, stack each project image, title and supporting text in reading order.
Keep controls easy to distinguish from captions. Do not shorten the project facts
or add new sections. Show the changed section and list what still needs to be
implemented and checked in the exported website.A real exercise: Fieldnote with Codex
Fieldnote includes an original brief, the unchanged Codex HTML and desktop/mobile checks. No frontend-design Skill was supplied; this is not a ChatGPT or Claude Design test.
A real exercise: Fieldnote with CodexCommon questions
Do Neruve prompts run automatically in Stitch?
No automatic integration is claimed. These original exercises can be adapted as input in your own tool. Paid paired prompts retain their item and plan access rules; compatibility and the resulting website must be checked separately.
Explore designs and paired prompts
Neruve's public catalog offers website designs, available paired prompts and a skills directory. Interactive previews are available without signing in; paired prompts follow the item and plan access rules. This workflow uses your own coding tool and does not require a public Neruve site generator.
Official references
Third-party tools and skills belong to their respective authors. These links are references, not a claim of partnership or bundled access.