Angell Bike

一个伪装成电子商务产品页面的在线赌场或博彩门户。

高对比度的促销设计，CTA使用醒目的渐变色。

grotesque-sans

• display32px · 700
• heading16px · 600
• body14px · 400

导航链接使用大写字母和宽间距。 · 标题使用粗体、厚重的字体以示强调。 · 次要信息使用小号文本。

紧凑

1px solid #e0e0e0

0 1px 3px rgba(0,0,0,0.1)

标准的电子商务双栏布局，左侧大侧边栏用于媒体，右侧侧边栏用于详情。

按钮和链接上的简单hover状态。

细微的颜色变化或下划线。 · 标准的按钮按压效果。

• button 大型、全宽或半宽按钮，文字粗体大写，常使用紫到红的渐变背景。
• card 标准的电子商务产品卡片布局。
• chip 用于颜色选择的简单彩色圆圈。
• input 用于数量和搜索的标准边框输入框。
• hero 带有叠加文字和一位女性形象的大型促销横幅图片。

• 语气 促销性、紧迫感强且非正式。
• 标题风格 全大写、粗体，常带有感叹号或促销关键词。
• 按钮文案 大型、粗体、大写的按钮，使用对比色（如渐变色）。

• 不要使用微妙的渐变——截图显示主CTA使用的是醒目的高饱和度紫到红渐变。
• 不要谨慎使用大写字母——截图显示导航和标题广泛使用全大写。
• 不要使用单一、平静的背景色——截图显示的是繁忙的促销图片和鲜艳的强调色。
• 不要使用极简、干净的布局——截图显示的是密集的信息和促销横幅。
• 不要到处使用柔软的圆角——截图显示的元素大多是方形或略微圆角。
• 不要使用单色配色方案——截图显示的是明亮的蓝色、红色、黄色和紫色的混沌混合。
• 避免: 微妙或低调的文案。
• 避免: 大量留白。
• 避免: 柔和的色彩搭配。