How do I use the Iridescent Butterfly UI System Board template?
Choose the primary action to open PicX Studio with the available template settings. Review the model and format, personalize the creative direction, and generate when ready.
A polished dark-mode Chinese UI/UX design system presentation board featuring a glowing butterfly theme, suitable for design case studies, portfolio covers, and style-system showcases. (free to use) — Free AI image template on PicX Studio.
{"type":"UI/UX design system showcase board","theme":"dark mode, nature-inspired, luminous iridescent aesthetic","language":"Chinese","canvas":{"aspect_ratio":"square poster","background":"deep midnight navy to black with subtle glow","style":"premium futuristic presentation board with thin neon-blue panel outlines, glossy highlights, soft bloom, and high contrast"},"header":{"title":"自然灵感 UI\n{argument name=\"system title\" default=\"蝴蝶虹彩\"}\nUI/UX 设计系统","description":"{argument name=\"chinese description\" default=\"从蝴蝶翅膀中汲取灵感,将结构色的虹彩光泽与深邃蓝融入界面设计,创造轻盈、灵动、充满生命力的数字体验。\"}","hero_image":"an oversized, ultra-detailed glowing butterfly wing in electric blue, violet, and iridescent cyan filling the upper-right half, with visible vein structure, translucent edges, spark-like particles, and a second blurred wing behind it"},"layout":{"sections":[{"title":"1. 设计灵感","position":"upper left below header","count":4,"labels":["iridescent butterfly wing macro","blue-purple wing texture close-up","light refraction prism flare","butterfly wing cell pattern"]},{"title":"2. 关键词","position":"upper right below hero","count":5,"labels":["虹彩","灵动","轻盈","深邃","自然"],"icon_style":"simple glowing line icons inside rounded dark cards"},{"title":"3. 色彩系统","position":"mid left","subsections":[{"title":"主色","count":3,"labels":["大闪蝶蓝 #1E5BFF","虹彩紫 #7A5CFF","天空光 #00E6FF"]},{"title":"中性色","count":3,"labels":["午夜黑 #060F19","柔和海军蓝 #141A2E","珍珠白 #F3F6FC"]},{"title":"强调色与渐变","count":2,"labels":["彩虹光泽","蝴蝶光芒"]}],"visual":"circular color swatches and gradient spheres with Chinese labels beneath"},{"title":"4. 排版","position":"mid right","count":1,"labels":["Aa Poppins Light / Regular / Medium / SemiBold"],"visual":"large white Aa on dark card"},{"title":"5. 应用图标","position":"left center","count":1,"text":"{argument name=\"app name\" default=\"Winglet\"} 轻盈。灵动。优雅。","visual":"glowing butterfly app icon beside app name"},{"title":"6. UI 组件","position":"center","subsections":[{"title":"按钮","count":3,"labels":["主要按钮","次要按钮","玻璃质感"]},{"title":"图标","count":2,"labels":["心形收藏","发光圆环"]},{"title":"开关","count":1,"labels":["开关"]}],"visual":"rounded blue buttons, neon icon buttons, and a glowing toggle on a dark panel"},{"title":"其他元素","position":"right center","count":4,"labels":["搜索框","标签 New","进度条 (72%)","卡片 Blue Morpho"],"visual":"small utility UI widgets in a compact horizontal card"},{"title":"7. 移动端 UI","position":"lower left","count":3,"labels":["搜索页面","带有大型蝴蝶插图的今日页面","带有波形图的音频播放页面"],"visual":"three smartphone mockups with rounded corners, dark interface, blue-violet butterfly visuals"},{"title":"8. 网页设计预览","position":"lower right","count":1,"labels":["光之生命"],"visual":"desktop landing page mockup with butterfly hero image, top navigation, bright blue call-to-action button, and Chinese body text"},{"title":"9. 视觉背景","position":"bottom full width","count":4,"labels":["flowing light ribbon background 1","swirling iridescent vortex","flowing light ribbon background 2","radiant crystalline burst"],"visual":"four elongated rectangular background samples in purple, blue, and cyan"}],"footer":{"count":1,"text":"源于自然的设计,为体验而生。","center_icon":"small butterfly icon"}},"art_direction":{"materials":"glassmorphism, neon edge lighting, smooth gradients, subtle reflections","colors":"electric blue, indigo, violet, cyan, white","composition":"clean grid with 9 numbered content sections, generous spacing, thin rounded borders, and a dominant butterfly hero image","render_quality":"highly polished, crisp typography, premium Behance-style design system board"}}
Use Iridescent Butterfly UI System Board to plan an AI image around gpt-image-2 generation, themes such as en and gpt-image-2. Match the preview's composition first, then personalize the subject, setting, and mood for your own project.
Use the primary action to load the template settings in PicX Studio.
Adjust the subject and creative details for your destination.
Create the image, compare the result with the preview, and refine one variable at a time.
A continuous mix — similar concepts first, woven with same-model prompts and fresh picks from the catalog.
Choose the primary action to open PicX Studio with the available template settings. Review the model and format, personalize the creative direction, and generate when ready.
Yes. You can change the subject, setting, lighting, mood, format, and available model controls before creating your image.
This template is free to open and customize. Generation usage is shown in PicX Studio before you create.
Start with gpt-image-2, which is the model associated with this template. You can compare another compatible model for a different finish.
A continuous mix — similar concepts first, woven with same-model prompts and fresh picks from the catalog.
Follow a topic to a crawlable collection of related PicX Studio templates.
36,410 public templates available. Verified via the PicX Studio public templates API; refreshed hourly.