Minimal Developer Portfolio Homepage
Generates a clean grid-based personal website homepage mockup for a software engineer portfolio design system.
提示词
{"type":"desktop browser screenshot of a minimalist personal portfolio website homepage design draft","style":"Swiss grid system, brutalist minimalism, black and white palette, faint technical blueprint guides, thin gray borders, lots of whitespace, monospace micro-labels mixed with bold geometric sans-serif display type","canvas":{"aspect_ratio":"wide 16:9","environment":"shown inside a Chrome-like browser window at localhost:5173 with visible tabs, bookmarks bar, and address bar","background":"white"},"brand":{"logo":"small square outlined mark with initials NRS","name":"Naufaldi Rafif S."},"header":{"position":"top fixed website navbar below browser chrome","height":"about 64px","left_brand":"NRS logo followed by Naufaldi Rafif S.","navigation":{"count":6,"items":["HOME","BLOG","PROJECTS","ABOUT","SPEAKER","OTHER with down chevron"],"active_item":"HOME in a thin outlined rectangular tab"},"actions":{"count":3,"items":["Contact white outlined button","Download CV black filled button with arrow","small square sun/theme icon button"]}},"layout":{"main_container":"large centered rectangular grid area with faint vertical and horizontal guide lines, coordinate labels, and thin border","technical_annotations":{"count":7,"labels":["X-1440","X-768","X-0","X-1024","X-768","X-480","Y-0 / Y-360 / Y-720 guide markings"]},"sections":[{"title":"01 // INTRO","position":"left large content column","count":1,"content":"huge boxed headline reading NAUFALDI RAFIF S. split across two lines, black all-caps extra-bold type"},{"title":"professional summary","position":"below headline in left column","count":3,"items":["subtitle: Software Engineer & Mentor","specialty tags: PRODUCT SYSTEMS | BACKEND FOUNDATIONS | ENGINEERING MENTORSHIP","paragraph: My foundation is frontend, but the direction is broader: backend ownership, product architecture, and end-to-end software delivery."]},{"title":"02 // ROUTES","position":"right sidebar separated by a vertical divider","count":3,"items":["01 View projects, black active card with code icon and right arrow","02 Get in touch, white row with right arrow","03 Download CV, white row with right arrow"]},{"title":"bottom status strip","position":"bottom of bordered container","count":4,"items":["OPEN TO WORK","7 YRS EXPERIENCE","1000+ MENTEES","BEKASI, INDONESIA"]}],"footer_meta":"right side of bottom strip shows BUILD:2026 and PRD:01"},"typography":{"headline":"massive uppercase bold sans-serif, tight spacing","body":"clean readable sans-serif","microcopy":"small uppercase monospace with wide letter spacing"},"color_palette":{"primary":"#0b0d0e near-black","background":"#ffffff","border":"#e8e8e8 light gray","guides":"#edf2ef very faint green-gray","accent":"thin green line on active route card and top grid guide"},"composition_notes":"Make it look like a polished web design system mockup generated for implementation, not a marketing landing page; emphasize precise alignment, grid overlays, coordinate labels, and modern developer portfolio aesthetics."}
如何使用这条提示词
- 1
复制上方完整的提示词。
- 2
打开支持 GPT Image 2 的平台（例如 YouMind），把提示词粘贴进去。
- 3
按你的想法替换主体、风格或细节，然后生成。
这是 YouMind 提示词库里的一条免费 AI 提示词。这里还有成千上万条 图像 提示词，都能免费复制和改用。
探索更多 图像 提示词
更多提示词功能
