精选 · 开放 · 免费
Ideogram
一个具有精致编辑美学的高端AI图像生成平台。
aiimage
01
设计气质 DNA
AI图像生成设计开源排版
高端设计工作室与现代科技初创公司的融合。
02
色彩
#BD9FFFAccent
#232425Ink
rgba(35,36,37,0.72)Ink soft
#FFF9F4BG
#EDE7E0BG soft
rgba(35,36,37,1.0)Line
高对比度的编辑调色板,采用温暖的米白色基底和充满活力的薰衣草色作为交互元素的强调色。
03
字体
didone-serif · humanist-sans · monospace
- display
74px · 400 - h1
48px · 400 - body
16px · 400 - caption
11px · 500
展示字体使用高对比度的衬线体,字距较紧。 · 正文使用简洁的人文主义无衬线字体。 · 小字号文本在标签和导航中使用大写和增加字距。
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
通过慷慨的内边距建立垂直韵律,主要区块的内边距通常为80px。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 19px
pill · 999px
1px solid #232425
rgba(35, 36, 37, 0.08) 0px 1px 2px 0px
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
单栏编辑式布局,在功能展示区扩展为多栏网格。
07
动效与交互
150msmicro
180mssmall
450msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
内容过渡使用淡入和滑动效果。 · 交互元素在悬停时发生颜色和背景变化。
微妙的颜色变化和透明度改变。 · 提供即时视觉反馈,无复杂动画。
08
组件
- button 药丸形按钮,采用高对比度填充(黑/白/薰衣草色)和慷慨的内边距。
- card 功能卡片,排版简洁,有时配以大尺寸图像。
- chip 小型、大写的文本标签,用于分类。
- input 简洁、带边框的输入框。
- hero 大尺寸衬线字体排版,搭配全宽图像或轮播图。
09
文案语气与禁用清单
- 语气 自信、专业且注重设计。
- 标题风格 简洁、有冲击力的陈述,使用大号衬线字体。
- 按钮文案 直接且以行动为导向,常使用药丸形按钮。
- 不要使用纯白色(#FFFFFF)作为主背景——截图显示的是温暖的米白色(#FFF9F4)。
- 不要对标题使用通用的无衬线字体——截图显示的是高对比度的衬线字体。
- 不要使用标准蓝色作为强调色——截图显示的是独特的薰衣草色(#BD9FFF)用于交互元素。
- 不要使用尖锐的方形按钮圆角——截图显示的是完全圆润的药丸形按钮。
- 不要使用厚重、块状的阴影——截图显示的是非常微妙、几乎不可见的盒阴影。
- 不要使用密集、拥挤的布局——截图显示内容区块周围有慷慨的留白和内边距。
- 避免: 充满术语的技术描述
- 避免: 过于随意或口语化的语言
- 避免: 拥挤的布局
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
一个具有精致编辑美学的高端AI图像生成平台。设计依赖于高对比度调色板,包含温暖的米白色(#FFF9F4)背景、深墨色(#232425)和充满活力的薰衣草色强调(#BD9FFF)。排版将高对比度的迪多内衬线体用于标题,简洁的人文主义无衬线体用于正文。关键禁忌:避免纯白背景,避免通用的无衬线标题字体,避免方形按钮圆角。布局宽敞且具有编辑风格,优先考虑清晰度和视觉冲击力。
en · zh-CN · zh-TW · ja · ko