---
name: "Magic Spoon"
description: "成功融合了怀旧的'麦片盒'活力感与现代、简洁且高度易读的数字排版，值得借鉴。"
version: alpha
specification_status: not-validated
license_status: unknown

colors:
  background: "#FFFFFF"
  primary: "#3F0791"
  secondary: "#5D23DD"
  tertiary: "#9100ED"
  neutral: "#DAD9FF"
  bg-soft: "#DAD9FF"
  bg-quiet: "#F5F3FF"
  muted-soft: "#E8E6FF"
  line: "rgba(63,7,145,0.2)"

typography:
  display:
    fontFamily: geometric-sans
    fontSize: 48px
    lineHeight: 1.0
    fontWeight: 900
    letterSpacing: "-1px"
  heading:
    fontFamily: humanist-sans
    fontSize: 24px
    lineHeight: 1.2
    fontWeight: 700
    letterSpacing: "0.72px"
  body:
    fontFamily: humanist-sans
    fontSize: 16px
    lineHeight: 1.0
    fontWeight: 400
    letterSpacing: "normal"
  caption:
    fontFamily: humanist-sans
    fontSize: 13px
    lineHeight: 1.4
    fontWeight: 400
    letterSpacing: "0.7px"

rounded:
  sm: 4px
  md: 10px
  lg: 28px
  pill: 50px

spacing:
  xs: 4px
  sm: 8px
  md: 16px
  lg: 24px
  xl: 32px
  2xl: 48px
  3xl: 64px

---

## Overview

一个大胆、趣味的DTC麦片品牌，运用深紫色调和醒目的排版，连接怀旧情感与现代健康理念。

*一个充满活力、怀旧的麦片品牌，为注重健康的成年人重新设计。*

## Colors

以洁净白色为底的高对比度紫色品牌色，辅以产品摄影中鲜艳的柔和色调。

- **Background (`#FFFFFF`)** — uses `bg` token
- **Primary text (`#3F0791`)** — uses `ink` token
- **Secondary text (`#5D23DD`)** — uses `ink-soft` token
- **Accent (`#9100ED`)** — uses `accent` token
- **Muted (`#DAD9FF`)** — uses `muted` token
- **Borders (`rgba(63,7,145,0.2)`)** — uses `line` token

## Typography

- **Display:** geometric-sans
- **Body:** humanist-sans

- 排版主要使用 Poppins 用于标题和正文，Mabry 用于品牌标志元素。
- 标题和行动号召文字大量使用大写转换。
- 正文保持中性的400字重，以确保在鲜艳配色下的可读性。

## Layout

标准电商结构：公告栏、固定导航栏、全宽分割式主视觉，后接产品网格。

*Rhythm:* 基于标准4px网格，导航区域间距紧凑，主视觉区域留有充足内边距。

## Elevation & Depth

- rgba(0, 0, 0, 0.1) 0px 20px 60px 0px
- rgba(0, 0, 0, 0.08) 0px 15px 50px 0px
- rgba(0, 0, 0, 0.25) 0px 5px 15px 0px
- Borders: 1px solid rgba(63,7,145,0.2)

## Shapes

- `sm`: 4px
- `md`: 10px
- `lg`: 28px
- `pill`: 50px

## Components

- **button:** 药丸形按钮，采用纯紫色填充或透明背景配紫色边框，文字为大写粗体排版。
- **card:** 产品卡片采用大圆角（28px）和细微投影，常包含浮动的产品图像。
- **chip:** 小型圆角药丸形徽章，用于'热销'等标签，采用纯色背景填充。
- **input:** 简洁的矩形输入框，带有细微边框，聚焦时切换至高亮状态。
- **hero:** 全宽分割式布局，一侧为巨大的标题文字，另一侧为浮动、动态定位的产品图像。

## Do's and Don'ts

**Don't:**
- 避免使用纤细衬线字体——截图显示的是粗体几何无衬线体和人文主义无衬线体。
- 避免将布局扁平化为严格网格——截图显示产品图像重叠浮动。
- 避免使用单色或灰暗配色方案——截图显示鲜艳的紫色和多彩的产品照片。
- 避免在标题中使用小写句首大写——截图显示激进的大写文字转换。
- 避免交互元素使用尖锐、无圆角的边角——截图显示充足的药丸形状。
- 避免主导航中无色彩——截图显示深色背景配以鲜艳文字和点缀色。

---

## System Prompt (paste into AI agent)

```
Magic Spoon 是一个面向注重健康的成年人的趣味高端DTC麦片品牌。其视觉标识以充满活力的深紫色主色（#3F0791）与洁净白色背景形成对比，并常辅以产品摄影中的明亮柔和色调。关键字体类别包括几何无衬线体和人文主义无衬线体，采用粗体大写转换。关键设计约束：避免纤细衬线体，保持高对比度，确保充足、趣味的圆角。布局常采用重叠的浮动图像而非僵化网格，创造出动态的、复古现代风格的电商体验。
```