feat: 导出 SproutClaw .sproutclaw 配置
包含 extensions、skills、prompts、settings、auth、models、mcp 等配置。 排除 node_modules、npm 缓存、sessions 等运行时数据。
This commit is contained in:
@@ -0,0 +1,14 @@
|
||||
# home-design-trends-2026
|
||||
|
||||
- Canvas format: ppt169
|
||||
- Created: 20260422
|
||||
|
||||
## Directories
|
||||
|
||||
- `svg_output/`: raw SVG output
|
||||
- `svg_final/`: finalized SVG output
|
||||
- `images/`: presentation assets
|
||||
- `notes/`: speaker notes
|
||||
- `templates/`: project templates
|
||||
- `sources/`: source materials and normalized markdown
|
||||
- `exports/`: generated PPTX files (timestamped history)
|
||||
@@ -0,0 +1,386 @@
|
||||
# 2026家居趋势 - Design Spec
|
||||
|
||||
> This document is the human-readable design narrative — rationale, audience, style, color choices, content outline. It is read once by downstream roles for context.
|
||||
>
|
||||
> The machine-readable execution contract lives in `spec_lock.md` (short form of color / typography / icon / image decisions). Executor re-reads `spec_lock.md` before every SVG page to resist context-compression drift. Keep the two files in sync; if they diverge, `spec_lock.md` wins.
|
||||
|
||||
## I. Project Information
|
||||
|
||||
| Item | Value |
|
||||
| ---- | ----- |
|
||||
| **Project Name** | 2026家居趋势：回归"人的尺度" |
|
||||
| **Canvas Format** | PPT 16:9 (1280×720) |
|
||||
| **Page Count** | 12 |
|
||||
| **Design Style** | General Versatile (A) |
|
||||
| **Target Audience** | 室内设计师、家居爱好者、装修计划者 |
|
||||
| **Use Case** | 家居设计趋势分享/培训演示 |
|
||||
| **Created Date** | 2026-04-22 |
|
||||
|
||||
---
|
||||
|
||||
## II. Canvas Specification
|
||||
|
||||
| Property | Value |
|
||||
| -------- | ----- |
|
||||
| **Format** | PPT 16:9 |
|
||||
| **Dimensions** | 1280×720 |
|
||||
| **viewBox** | `0 0 1280 720` |
|
||||
| **Margins** | left/right 60px, top/bottom 50px |
|
||||
| **Content Area** | 1160×620 |
|
||||
|
||||
---
|
||||
|
||||
## III. Visual Theme
|
||||
|
||||
### Theme Style
|
||||
|
||||
- **Style**: General Versatile — 杂志质感的图文混排风格
|
||||
- **Theme**: Dark theme（深色暖调底色）
|
||||
- **Tone**: 高端、温暖、自然、人文、杂志感
|
||||
|
||||
### Color Scheme
|
||||
|
||||
| Role | HEX | Purpose |
|
||||
| ---- | --- | ------- |
|
||||
| **Background** | `#1A1714` | 深棕暖黑底色 |
|
||||
| **Secondary bg** | `#2A2520` | 卡片/区域背景 |
|
||||
| **Primary** | `#C4A882` | 标题装饰、金色暖调 |
|
||||
| **Accent** | `#D4956A` | 数据高亮、关键信息 |
|
||||
| **Secondary accent** | `#8B7355` | 渐变过渡、次要装饰 |
|
||||
| **Body text** | `#E8E0D4` | 主体文字（浅暖白） |
|
||||
| **Secondary text** | `#B0A08E` | 注释说明 |
|
||||
| **Tertiary text** | `#7A6E60` | 补充信息、页脚 |
|
||||
| **Border/divider** | `#3D362E` | 卡片边框、分隔线 |
|
||||
| **Success** | `#7BA37B` | 可持续/正向指标 |
|
||||
| **Warning** | `#C06048` | 强调/警示 |
|
||||
|
||||
### Gradient Scheme
|
||||
|
||||
```xml
|
||||
<!-- Title gradient -->
|
||||
<linearGradient id="titleGradient" x1="0%" y1="0%" x2="100%" y2="0%">
|
||||
<stop offset="0%" stop-color="#C4A882"/>
|
||||
<stop offset="100%" stop-color="#D4956A"/>
|
||||
</linearGradient>
|
||||
|
||||
<!-- Background decorative gradient -->
|
||||
<radialGradient id="bgDecor" cx="80%" cy="20%" r="50%">
|
||||
<stop offset="0%" stop-color="#C4A882" stop-opacity="0.08"/>
|
||||
<stop offset="100%" stop-color="#C4A882" stop-opacity="0"/>
|
||||
</radialGradient>
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## IV. Typography System
|
||||
|
||||
### Font Plan
|
||||
|
||||
**Typography direction**: Editorial Display（杂志展示风）— 标题使用衬线字体传递高级感，正文使用无衬线保证阅读性。
|
||||
|
||||
| Role | Chinese | English | Fallback tail |
|
||||
| ---- | ------- | ------- | ------------- |
|
||||
| **Title** | `SimSun` | `Georgia` | `serif` |
|
||||
| **Body** | `"Microsoft YaHei"`, `"PingFang SC"` | `Arial` | `sans-serif` |
|
||||
| **Emphasis** | `SimSun` | `Georgia` | `serif` |
|
||||
| **Code** | — | `Consolas, "Courier New"` | `monospace` |
|
||||
|
||||
**Per-role font stacks**:
|
||||
|
||||
- Title: `Georgia, SimSun, serif`
|
||||
- Body: `"Microsoft YaHei", "PingFang SC", Arial, sans-serif`
|
||||
- Emphasis: `Georgia, SimSun, serif`
|
||||
- Code: `Consolas, "Courier New", monospace`
|
||||
|
||||
### Font Size Hierarchy
|
||||
|
||||
**Baseline**: Body font size = 22px（内容密度适中，每页 3-5 要点为主）
|
||||
|
||||
| Purpose | Ratio to body | Size | Weight |
|
||||
| ------- | ------------- | ---- | ------ |
|
||||
| Cover title | 3.6x | 80px | Bold |
|
||||
| Chapter opener | 2.2x | 48px | Bold |
|
||||
| Page title | 1.5x | 32px | Bold |
|
||||
| Subtitle | 1.3x | 28px | SemiBold |
|
||||
| **Body content** | **1x** | **22px** | Regular |
|
||||
| Annotation / caption | 0.73x | 16px | Regular |
|
||||
| Page number / footnote | 0.55x | 12px | Regular |
|
||||
|
||||
---
|
||||
|
||||
## V. Layout Principles
|
||||
|
||||
### Page Structure
|
||||
|
||||
- **Header area**: 50-80px, 含页面标题及装饰元素
|
||||
- **Content area**: 560-620px, 主要图文内容区域
|
||||
- **Footer area**: 30-40px, 页码及来源信息
|
||||
|
||||
### Layout Pattern Library
|
||||
|
||||
本项目以图文并茂为核心，主要使用以下布局模式：
|
||||
|
||||
| Pattern | Used In |
|
||||
| ------- | ------- |
|
||||
| **Full-bleed + floating text** | P01 封面、P10 可持续奢华 |
|
||||
| **Asymmetric split (4:6 / 3:7)** | P03 色彩、P05 材质、P06 纹理、P08 奶油风 |
|
||||
| **Symmetric split (5:5)** | P04 色彩实践、P09 波西米亚&复古 |
|
||||
| **Center-radiating** | P07 CMT体系 |
|
||||
| **Single column centered** | P02 引言 |
|
||||
| **Three-column cards** | P11 书籍推荐 |
|
||||
| **Negative-space-driven** | P12 结语 |
|
||||
|
||||
### Spacing Specification
|
||||
|
||||
**Universal**:
|
||||
|
||||
| Element | Current Project |
|
||||
| ------- | --------------- |
|
||||
| Safe margin from canvas edge | 60px |
|
||||
| Content block gap | 30px |
|
||||
| Icon-text gap | 10px |
|
||||
|
||||
**Card-based layouts** (P07, P11):
|
||||
|
||||
| Element | Current Project |
|
||||
| ------- | --------------- |
|
||||
| Card gap | 24px |
|
||||
| Card padding | 24px |
|
||||
| Card border radius | 12px |
|
||||
|
||||
---
|
||||
|
||||
## VI. Icon Usage Specification
|
||||
|
||||
### Source
|
||||
|
||||
- **Built-in icon library**: `templates/icons/tabler-filled/` — 圆润贝塞尔曲线，契合家居/生活方式温暖调性
|
||||
- **Usage method**: Placeholder format `{{icon:tabler-filled/icon-name}}`
|
||||
|
||||
### Recommended Icon List
|
||||
|
||||
| Purpose | Icon Path | Page |
|
||||
| ------- | --------- | ---- |
|
||||
| 色彩主题 | `{{icon:tabler-filled/palette}}` | P03, P04 |
|
||||
| 材质主题 | `{{icon:tabler-filled/diamond}}` | P05 |
|
||||
| 纹理主题 | `{{icon:tabler-filled/paint}}` | P06 |
|
||||
| 家居 | `{{icon:tabler-filled/home}}` | P01, P02 |
|
||||
| 太阳/光线 | `{{icon:tabler-filled/sun}}` | P05 |
|
||||
| 树叶/自然 | `{{icon:tabler-filled/leaf}}` | P10 |
|
||||
| 星星/亮点 | `{{icon:tabler-filled/sparkles}}` | P07 |
|
||||
| 心/情感 | `{{icon:tabler-filled/heart}}` | P12 |
|
||||
| 书籍 | `{{icon:tabler-filled/book}}` | P11 |
|
||||
| 眼睛/视觉 | `{{icon:tabler-filled/eye}}` | P06 |
|
||||
| 调整 | `{{icon:tabler-filled/adjustments}}` | P07 |
|
||||
| 星标 | `{{icon:tabler-filled/star}}` | P08 |
|
||||
|
||||
---
|
||||
|
||||
## VII. Visualization Reference List
|
||||
|
||||
| Visualization Type | Reference Template | Used In |
|
||||
| ------------------ | ------------------ | ------- |
|
||||
| concentric_circles | `templates/charts/concentric_circles.svg` | P07 (CMT三层体系) |
|
||||
|
||||
---
|
||||
|
||||
## VIII. Image Resource List
|
||||
|
||||
| Filename | Dimensions | Ratio | Purpose | Intent | Type | Status |
|
||||
| -------- | ---------- | ----- | ------- | ------ | ---- | ------ |
|
||||
| intro_living.png | 1080x608 | 1.78 | P01 封面全屏背景 | Hero | Photography | Existing |
|
||||
| space_overview.png | 800x540 | 1.48 | P02 引言配图 | Side-by-side | Photography | Existing |
|
||||
| color_wheel.png | 559x823 | 0.68 | P03 色彩理论配图 | Side-by-side | Diagram | Existing |
|
||||
| brown_cozy.png | 658x496 | 1.33 | P03 棕色舒适空间 | Accent | Photography | Existing |
|
||||
| light_tone_room.png | 749x749 | 1.00 | P04 浅色调空间 | Side-by-side | Photography | Existing |
|
||||
| saturated_room.png | 853x671 | 1.27 | P04 高饱和度空间 | Side-by-side | Photography | Existing |
|
||||
| material_detail.png | 749x708 | 1.06 | P05 材质细节 | Side-by-side | Photography | Existing |
|
||||
| light_material.png | 800x1000 | 0.80 | P05 光与材质 | Accent | Photography | Existing |
|
||||
| texture_tactile.png | 615x398 | 1.55 | P06 触觉纹理 | Side-by-side | Photography | Existing |
|
||||
| texture_visual.png | 519x569 | 0.91 | P06 视觉纹理 | Side-by-side | Photography | Existing |
|
||||
| cmt_overview.png | 990x744 | 1.33 | P07 CMT体系总览 | Side-by-side | Photography | Existing |
|
||||
| cmt_neutral_mix.png | 1023x636 | 1.61 | P07 中性色搭配 | Accent | Photography | Existing |
|
||||
| dark_tone_luxury.png | 614x423 | 1.45 | P07 深色调奢华 | Accent | Photography | Existing |
|
||||
| cream_style.png | 681x499 | 1.36 | P08 奶油风空间 | Side-by-side | Photography | Existing |
|
||||
| bohemian_style.png | 615x924 | 0.67 | P09 波西米亚风 | Side-by-side | Photography | Existing |
|
||||
| retro_style.png | 1080x608 | 1.78 | P09 怀旧复古风 | Side-by-side | Photography | Existing |
|
||||
| sustainable_luxury.png | 417x500 | 0.83 | P10 可持续奢华 | Side-by-side | Photography | Existing |
|
||||
| book_cover1.png | 1080x732 | 1.48 | P11 书籍封面 | Side-by-side | Photography | Existing |
|
||||
| book_cover2.png | 1080x735 | 1.47 | P11 书籍封面背面 | Accent | Photography | Existing |
|
||||
| book_inside1.png | 1080x741 | 1.46 | P11 书籍内页展示 | Accent | Photography | Existing |
|
||||
| book_inside2.png | 1080x738 | 1.46 | P11 书籍内页展示 | Accent | Photography | Existing |
|
||||
| book_display1.png | 1080x727 | 1.49 | P12 书籍展示 | Side-by-side | Photography | Existing |
|
||||
| book_display2.png | 1080x743 | 1.45 | P12 书籍展示 | Accent | Photography | Existing |
|
||||
|
||||
---
|
||||
|
||||
## IX. Content Outline
|
||||
|
||||
### Part 1: 开篇
|
||||
|
||||
#### Slide 01 - 封面
|
||||
|
||||
- **Layout**: Full-bleed + floating text
|
||||
- **Title**: 2026家居趋势
|
||||
- **Subtitle**: 回归"人的尺度"，让色彩、材质与纹理塑造"空间的高级感"
|
||||
- **Info**: 基于《空间的高级感》· 2026
|
||||
- **Images**: `intro_living.png`（hero全屏，暗色渐变叠加层保证文字可读）
|
||||
|
||||
#### Slide 02 - 从"网红风"到"人的尺度"
|
||||
|
||||
- **Layout**: Single column centered + side-by-side image
|
||||
- **Title**: 从"网红风"到"人的尺度"
|
||||
- **Images**: `space_overview.png`
|
||||
- **Content**:
|
||||
- 过去几年家居"网红风"迅速更迭
|
||||
- 2026年转向：从视觉符号堆砌回归人本关怀
|
||||
- 高级感 = 色彩 + 材质 + 纹理的精妙搭配
|
||||
- 有颜值，更有温度与情感
|
||||
|
||||
### Part 2: 三大底层元素
|
||||
|
||||
#### Slide 03 - 色彩：空间的情绪魔法师
|
||||
|
||||
- **Layout**: Asymmetric split (4:6) — 左图右文
|
||||
- **Title**: 色彩：空间的"情绪魔法师"
|
||||
- **Images**: `color_wheel.png`（左侧主图），`brown_cozy.png`（右下小图点缀）
|
||||
- **Content**:
|
||||
- 色彩是空间的第一印象
|
||||
- 能改变视觉尺度、营造氛围
|
||||
- 暖色调 → 温柔包裹感；冷色调 → 开阔冷静
|
||||
- 不同色彩传递不同信号与心理反应
|
||||
|
||||
#### Slide 04 - 色彩实践：冷暖色调的空间效果
|
||||
|
||||
- **Layout**: Symmetric split (5:5) — 左右对比
|
||||
- **Title**: 冷暖色调的空间效果对比
|
||||
- **Images**: `light_tone_room.png`（左，浅色调），`saturated_room.png`（右，高饱和度）
|
||||
- **Content**:
|
||||
- 左：浅色调 → 增大光线反射 → 空间显得宽敞
|
||||
- 右：高饱和度 → 房间紧凑小巧
|
||||
- 灰绿 → 平静专注；咖色 → 阳光包裹；跳色 → 个性活力
|
||||
|
||||
#### Slide 05 - 材质：触手可及的空间语言
|
||||
|
||||
- **Layout**: Asymmetric split (3:7) — 右侧大图
|
||||
- **Title**: 材质：触手可及的空间语言
|
||||
- **Images**: `material_detail.png`（主图），`light_material.png`（次图/accent）
|
||||
- **Content**:
|
||||
- 材料是色彩搭配的物理基础
|
||||
- 原木地板 → 质朴温暖；手工编织 → 慵懒松弛
|
||||
- 光本身也是一种材质
|
||||
- 巧妙照明 + 色彩光影 → 不依赖昂贵材料也能实现高级感
|
||||
|
||||
#### Slide 06 - 纹理：赋予空间灵魂的细节
|
||||
|
||||
- **Layout**: Asymmetric split (5:5) — 左右并列
|
||||
- **Title**: 纹理：赋予空间灵魂的细节
|
||||
- **Images**: `texture_tactile.png`（左，触觉），`texture_visual.png`（右，视觉）
|
||||
- **Content**:
|
||||
- 纹理 = 空间的"指纹"，独一无二的辨识度
|
||||
- 触觉纹理：羊毛地毯 → 柔软温暖；粗陶花瓶 → 凹凸肌理
|
||||
- 视觉纹理：壁纸图案 → 眼睛"感受"肌理
|
||||
|
||||
### Part 3: CMT 体系
|
||||
|
||||
#### Slide 07 - CMT 体系：色彩·材质·纹理的交响
|
||||
|
||||
- **Layout**: Center-radiating + accent images
|
||||
- **Title**: CMT 体系：编织全方位感官体验
|
||||
- **Visualization**: concentric_circles (CMT三层)
|
||||
- **Images**: `cmt_overview.png`（主视觉），`cmt_neutral_mix.png`（中性色案例），`dark_tone_luxury.png`（深色调案例）
|
||||
- **Content**:
|
||||
- CMT = Colour + Material + Texture
|
||||
- 物理层：光滑/粗糙、透明/不透明、高光/亚光
|
||||
- 心理层：手工/工业、简朴/奢华、安慰/刺激
|
||||
- 不是简单叠加，是系统性编织 — 如交响乐团的指挥
|
||||
|
||||
### Part 4: 2026 流行风格
|
||||
|
||||
#### Slide 08 - 奶油风进化论
|
||||
|
||||
- **Layout**: Asymmetric split (4:6) — 左文右图
|
||||
- **Title**: 奶油风 2.0：从公式化到细腻表达
|
||||
- **Images**: `cream_style.png`
|
||||
- **Content**:
|
||||
- 奶油风正经历深刻"进化"
|
||||
- 不再只是"米白墙面+原木家具"的公式
|
||||
- 颜色基底：奶油色、燕麦色、米白色
|
||||
- 材质点睛：羊毛、亚麻、天然结疤原木、手工陶瓷
|
||||
- 真正的治愈空间 = 可触摸 + 可感知
|
||||
|
||||
#### Slide 09 - 波西米亚 & 怀旧复古
|
||||
|
||||
- **Layout**: Symmetric split (5:5) — 左右双风格
|
||||
- **Title**: 自由灵魂与时间记忆
|
||||
- **Images**: `bohemian_style.png`（左，波西米亚），`retro_style.png`（右，怀旧复古）
|
||||
- **Content**:
|
||||
- 波西米亚：大胆色彩 + 自由织物 + 手工挂毯 → "有层次的不羁感"
|
||||
- 怀旧复古：风化木材 + 熟铁 + 柳编 → 带有使用痕迹的"时间感"
|
||||
- 共同特点：对真实与情感的渴望
|
||||
|
||||
#### Slide 10 - 可持续奢华
|
||||
|
||||
- **Layout**: Full-bleed + floating text（breathing页）
|
||||
- **Title**: 可持续奢华：负责任的审美
|
||||
- **Images**: `sustainable_luxury.png`
|
||||
- **Content**:
|
||||
- 2026 奢华不再是昂贵材料的堆砌
|
||||
- 环保饰面、自然光照、再生木材、软木、黄麻纤维
|
||||
- 从"炫耀性消费"转向"负责任的审美"
|
||||
- 与世界和谐共存的生活哲学
|
||||
|
||||
### Part 5: 结语
|
||||
|
||||
#### Slide 11 - 一本书解锁空间高级感
|
||||
|
||||
- **Layout**: Three-column cards（书籍展示）
|
||||
- **Title**: 《空间的高级感》— 可拆解、可复制、可验证的美学体系
|
||||
- **Images**: `book_cover1.png`, `book_cover2.png`, `book_inside1.png`, `book_inside2.png`
|
||||
- **Content**:
|
||||
- 作者：宋文雯（清华大学色彩研究所常务副所长）
|
||||
- 创新引入 CMF → CMT 体系
|
||||
- 色彩篇 + 材料篇 + 纹理篇 + 综合篇
|
||||
- 适合：设计师专业提升 / 装修业主自学
|
||||
|
||||
#### Slide 12 - 结语
|
||||
|
||||
- **Layout**: Negative-space-driven + accent image
|
||||
- **Title**: 让家回归"人的尺度"
|
||||
- **Images**: `book_display1.png`, `book_display2.png`
|
||||
- **Content**:
|
||||
- 高级感的本质：色彩、材质、纹理的精妙共鸣
|
||||
- 有颜值，更有温度与情感
|
||||
- 参考来源：《空间的高级感——设计师的色彩、材质、纹理搭配指南》
|
||||
|
||||
---
|
||||
|
||||
## X. Speaker Notes Requirements
|
||||
|
||||
Generate corresponding speaker note files for each page, saved to the `notes/` directory:
|
||||
|
||||
- **File naming**: Match SVG names, e.g., `01_cover.md`
|
||||
- **Content includes**: Script key points, timing cues, transition phrases
|
||||
- **Style**: 自然对话式（conversational），适合设计趋势分享场景
|
||||
- **Duration**: 约 15-20 分钟总时长
|
||||
- **Purpose**: Inform + Inspire
|
||||
|
||||
---
|
||||
|
||||
## XI. Technical Constraints Reminder
|
||||
|
||||
### SVG Generation Must Follow:
|
||||
|
||||
1. viewBox: `0 0 1280 720`
|
||||
2. Background uses `<rect>` elements
|
||||
3. Text wrapping uses `<tspan>` (`<foreignObject>` FORBIDDEN)
|
||||
4. Transparency uses `fill-opacity` / `stroke-opacity`; `rgba()` FORBIDDEN
|
||||
5. FORBIDDEN: `clipPath`, `mask`, `<style>`, `class`, `foreignObject`
|
||||
6. FORBIDDEN: `textPath`, `animate*`, `script`
|
||||
7. `marker-start` / `marker-end` conditionally allowed: `<marker>` must be in `<defs>`, `orient="auto"`, shape must be triangle / diamond / circle
|
||||
|
||||
### PPT Compatibility Rules:
|
||||
|
||||
- `<g opacity="...">` FORBIDDEN (group opacity); set opacity on each child element individually
|
||||
- Image transparency uses overlay mask layer (`<rect fill="bg-color" opacity="0.x"/>`)
|
||||
- Inline styles only; external CSS and `@font-face` FORBIDDEN
|
||||
Binary file not shown.
@@ -0,0 +1,25 @@
|
||||
No,Filename,Width,Height,AspectRatio,SizeKB,Category,ImageArea_SxS,TextArea_SxS
|
||||
1,bohemian_style.png,615,924,0.67,906.5,Portrait,399x600,741x600
|
||||
2,book_cover1.png,1080,732,1.48,607.7,Standard landscape,812x550,328x600
|
||||
3,book_cover2.png,1080,735,1.47,705.5,Standard landscape,812x553,328x600
|
||||
4,book_display1.png,1080,727,1.49,360.7,Standard landscape,812x547,328x600
|
||||
5,book_display2.png,1080,743,1.45,828.1,Standard landscape,812x559,328x600
|
||||
6,book_inside1.png,1080,741,1.46,810.2,Standard landscape,812x557,328x600
|
||||
7,book_inside2.png,1080,738,1.46,733.2,Standard landscape,812x555,328x600
|
||||
8,brown_cozy.png,658,496,1.33,248.5,Standard landscape,796x600,344x600
|
||||
9,cmt_neutral_mix.png,1023,636,1.61,458.4,Wide landscape,812x505,328x600
|
||||
10,cmt_overview.png,990,744,1.33,703.3,Standard landscape,798x600,342x600
|
||||
11,color_wheel.png,559,823,0.68,689.9,Portrait,408x600,732x600
|
||||
12,cream_style.png,681,499,1.36,332.0,Standard landscape,819x600,321x600
|
||||
13,dark_tone_luxury.png,614,423,1.45,413.0,Standard landscape,812x559,328x600
|
||||
14,intro_living.png,1080,608,1.78,450.7,Wide landscape,812x457,328x600
|
||||
15,light_material.png,800,1000,0.80,300.5,Portrait,480x600,660x600
|
||||
16,light_tone_room.png,749,749,1.00,585.5,Near square,600x600,540x600
|
||||
17,material_detail.png,749,708,1.06,938.5,Near square,635x600,505x600
|
||||
18,publisher_logo.png,640,640,1.00,130.7,Near square,600x600,540x600
|
||||
19,retro_style.png,1080,608,1.78,818.7,Wide landscape,812x457,328x600
|
||||
20,saturated_room.png,853,671,1.27,567.4,Standard landscape,763x600,377x600
|
||||
21,space_overview.png,800,540,1.48,439.5,Standard landscape,812x548,328x600
|
||||
22,sustainable_luxury.png,417,500,0.83,205.0,Near square,500x600,640x600
|
||||
23,texture_tactile.png,615,398,1.55,290.5,Wide landscape,812x525,328x600
|
||||
24,texture_visual.png,519,569,0.91,499.0,Near square,547x600,593x600
|
||||
|
Binary file not shown.
|
After Width: | Height: | Size: 906 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 608 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 706 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 361 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 828 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 810 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 733 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 248 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 458 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 703 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 690 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 332 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 413 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 451 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 300 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 586 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 938 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 131 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 819 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 567 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 440 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 205 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 290 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 499 KiB |
@@ -0,0 +1,4 @@
|
||||
大家好，欢迎来到今天的分享。2026年，家居设计迎来了一场深刻的转变——从追逐"网红风"的视觉符号，回归到对人本身的关怀。今天我们将一起探索色彩、材质与纹理如何塑造空间的高级感。
|
||||
|
||||
要点：① 2026家居趋势主题引入 ② 从视觉堆砌到人本回归 ③ 三大核心元素预告
|
||||
时长：1 分钟
|
||||
@@ -0,0 +1,6 @@
|
||||
[过渡] 在正式展开之前，让我们先回顾一下背景。
|
||||
|
||||
过去几年，我们见惯了各种家居"网红风"的迅速更迭——今天流行这个，明天又换成那个。但到了2026年，一个更深层的变化正在发生。设计师们开始重新思考：什么才是真正让人舒适的空间？答案不在于堆砌视觉符号，而在于色彩、材质和纹理的精妙搭配。 [停顿] 正如一位设计师所说："这样的家，有颜值，更有温度与情感。"
|
||||
|
||||
要点：① 网红风更迭的背景 ② 2026年的转变方向 ③ 高级感=色彩+材质+纹理
|
||||
时长：1.5 分钟
|
||||
@@ -0,0 +1,6 @@
|
||||
[过渡] 那我们就从第一个元素——色彩说起。
|
||||
|
||||
色彩是空间给人的第一印象，它就像一位"情绪魔法师"。你走进一个房间，第一个感受到的不是家具的品牌、材料的价格，而是整个空间的色彩氛围。暖色调让你觉得被温柔地包裹着，冷色调则让同样的面积显得更加开阔。 [停顿] 不同的色彩还会触发不同的心理反应——灰绿色让人平静专注，温暖的咖色营造阳光包裹的舒适感，而少量的跳色点缀，则能赋予空间独特的个性。
|
||||
|
||||
要点：① 色彩是第一印象 ② 暖色/冷色的空间效果差异 ③ 色彩的心理反应机制
|
||||
时长：1.5 分钟
|
||||
@@ -0,0 +1,6 @@
|
||||
[过渡] 为了更直观地理解色彩的力量，我们来看两个对比案例。
|
||||
|
||||
左边这个空间采用了浅色调墙面，可以看到它增大了自然光的反射区域，让整个房间显得非常宽敞明亮。右边则选择了饱和度较高的颜色，同样的面积却给人紧凑、小巧的感觉。 [停顿] 这就是色彩的魔力——同一个空间，仅仅改变色彩，就能带来截然不同的感受。这也是为什么专业设计师在动手之前，总会先确定整体的色彩基调。
|
||||
|
||||
要点：① 浅色调=宽敞效果 ② 高饱和度=紧凑效果 ③ 色彩选择先于其他设计决策
|
||||
时长：1 分钟
|
||||
@@ -0,0 +1,6 @@
|
||||
[过渡] 说完色彩，我们来看第二个元素——材质。
|
||||
|
||||
很多人在装修时容易只看重视觉效果，却忽略了材质的重要性。其实，材料是色彩搭配的物理基础。当你走进一个房间，脚下的地板、眼前的墙面、头顶的天花板……都在用各自的"材质语言"和你对话。亚光的原木地板散发质朴与温暖，柔软的手工编织物传递慵懒与松弛。 [停顿] 还有一点很多人会忽略——光，本身也是一种材质。不同材质在光线照射下会呈现截然不同的质感。所以赋予空间高级感，不一定要依赖昂贵的材料，巧妙的照明和光影搭配就能让材质焕发新生。
|
||||
|
||||
要点：① 材质是色彩的物理基础 ② 不同材质传递不同情感 ③ 光也是材质 ④ 不依赖昂贵材料
|
||||
时长：1.5 分钟
|
||||
@@ -0,0 +1,6 @@
|
||||
[过渡] 第三个元素是纹理——它往往被认为是最容易被忽视的，但也是最有灵魂的。
|
||||
|
||||
纹理就像空间的"指纹"，赋予了每个空间独一无二的辨识度。我们可以从两个维度来理解它：触觉纹理和视觉纹理。触觉纹理是你能直接感知的——赤脚踩在羊毛地毯上的柔软温暖，手指轻抚粗陶花瓶的凹凸肌理。 [停顿] 而视觉纹理则更微妙——当你看到一幅细腻图案的壁纸时，即便没有触摸，你的眼睛也能"感受"到它的肌理。这两种纹理共同为空间注入了灵魂。
|
||||
|
||||
要点：① 纹理=空间的指纹 ② 触觉纹理的直接感知 ③ 视觉纹理的想象与感受
|
||||
时长：1.5 分钟
|
||||
@@ -0,0 +1,6 @@
|
||||
[过渡] 了解了色彩、材质、纹理各自的力量之后，一个关键问题来了：如何将这三者有机融合？
|
||||
|
||||
这就引出了今天的核心方法论——CMT体系，即 Colour、Material、Texture 的整合应用。它不是三者的简单叠加，而是一种系统性的编织。 [停顿] 在物理层面，它传递光滑与粗糙、透明与不透明、高光与亚光的触感差异。在心理层面，它唤起手工感或工业感、简朴或奢华、安慰或刺激等丰富的情感联想。就像一位音乐家指挥着交响乐团，让色彩、材质、纹理在空间中和谐共鸣。右边这两个案例就展示了CMT体系的实际应用效果。
|
||||
|
||||
要点：① CMT=色彩+材质+纹理的系统 ② 物理层与心理层的双重感知 ③ 系统性编织而非简单叠加
|
||||
时长：2 分钟
|
||||
@@ -0,0 +1,6 @@
|
||||
[过渡] 有了CMT体系的框架，我们来看看2026年最受欢迎的几种风格是如何运用它的。
|
||||
|
||||
首先是奶油风。它在2026年依然很流行，但正在经历一场深刻的"进化"。以前的奶油风是公式化的——米白色墙面加原木家具，千篇一律。现在则走向了更细腻的表达。 [停顿] 真正高级的奶油风，需要在三个层面同时做文章：颜色基底用奶油色、燕麦色铺陈；材质上加入羊毛、亚麻等质感软装；纹理上保留天然结疤的原木、手工拉坯的陶瓷灯……这些细节的层层叠加，让它真正成为一个可触摸、可感知的治愈空间。
|
||||
|
||||
要点：① 奶油风从公式化到细腻 ② 颜色+材质+纹理三层发力 ③ 治愈空间=可触摸+可感知
|
||||
时长：1.5 分钟
|
||||
@@ -0,0 +1,6 @@
|
||||
[过渡] 接下来是两种看似不同、但有着共同内核的风格。
|
||||
|
||||
波西米亚风的魅力在于它的自由——大胆的色彩、手工编织的挂毯、民族风的靠垫、带流苏的窗帘……不同纹理之间的碰撞与融合，创造出"有层次的不羁感"。自由，却绝不凌乱。 [停顿] 而怀旧复古风格则用另一种方式打动人心——风化的木材、略带锈迹的熟铁、岁月打磨的柳编……这些带有使用痕迹的材质，本身就是故事的载体。它让家成为安放记忆的容器。两种风格的共同点是什么？是对真实与情感的深切渴望。
|
||||
|
||||
要点：① 波西米亚=自由不羁的纹理碰撞 ② 怀旧复古=时间感的材质载体 ③ 共同内核：对真实的渴望
|
||||
时长：1.5 分钟
|
||||
@@ -0,0 +1,6 @@
|
||||
[过渡] 最后一种值得关注的风格，代表了一种全新的价值观。
|
||||
|
||||
2026年的"奢华"正在被重新定义。它不再是昂贵材料的堆砌，而是一种对地球友好、经得起时间考验的"可持续奢华"。 [停顿] 环保饰面材料、最大化利用自然光照、再生木材、软木、黄麻纤维……真正的奢华，正从"炫耀性消费"转向"负责任的审美"。在这样的空间里，我们体验的不只是美，更是一种与世界和谐共存的生活哲学。
|
||||
|
||||
要点：① 奢华的重新定义 ② 可持续材料的创新应用 ③ 从炫耀到负责任的审美转变
|
||||
时长：1.5 分钟
|
||||
@@ -0,0 +1,6 @@
|
||||
[过渡] 如果大家想更深入地了解今天分享的这些内容，我强烈推荐一本书。
|
||||
|
||||
《空间的高级感——设计师的色彩、材质、纹理搭配指南》，作者宋文雯老师是清华大学色彩研究所的常务副所长。她创新性地将工业设计领域的CMF概念引入室内设计，构建了我们今天讲的CMT体系。全书分为色彩篇、材料篇、纹理篇和综合篇，是一套"可拆解、可复制、可验证"的空间美学体系。无论你是专业设计师还是即将装修的业主，都能从中获得实用的指导。
|
||||
|
||||
要点：① 书籍核心信息 ② 作者专业背景 ③ 四大内容板块 ④ 适合人群
|
||||
时长：1.5 分钟
|
||||
@@ -0,0 +1,6 @@
|
||||
[过渡] 让我们回到今天分享的起点。
|
||||
|
||||
2026年的家居趋势，归根到底是让家回归"人的尺度"。色彩是情绪的魔法师，材质是触手可及的语言，纹理是空间灵魂的细节——三者的精妙共鸣，构成了空间的高级感。 [停顿] 希望今天的分享能给大家带来启发。记住，高级感的空间不一定昂贵，但一定有颜值，更有温度与情感。谢谢大家！
|
||||
|
||||
要点：① 三大元素回顾 ② 高级感的本质 ③ 温度与情感的核心价值
|
||||
时长：1 分钟
|
||||
@@ -0,0 +1,127 @@
|
||||
# 01_封面
|
||||
|
||||
大家好，欢迎来到今天的分享。2026年，家居设计迎来了一场深刻的转变——从追逐"网红风"的视觉符号，回归到对人本身的关怀。今天我们将一起探索色彩、材质与纹理如何塑造空间的高级感。
|
||||
|
||||
要点：① 2026家居趋势主题引入 ② 从视觉堆砌到人本回归 ③ 三大核心元素预告
|
||||
时长：1 分钟
|
||||
|
||||
---
|
||||
|
||||
# 02_从网红风到人的尺度
|
||||
|
||||
[过渡] 在正式展开之前，让我们先回顾一下背景。
|
||||
|
||||
过去几年，我们见惯了各种家居"网红风"的迅速更迭——今天流行这个，明天又换成那个。但到了2026年，一个更深层的变化正在发生。设计师们开始重新思考：什么才是真正让人舒适的空间？答案不在于堆砌视觉符号，而在于色彩、材质和纹理的精妙搭配。 [停顿] 正如一位设计师所说："这样的家，有颜值，更有温度与情感。"
|
||||
|
||||
要点：① 网红风更迭的背景 ② 2026年的转变方向 ③ 高级感=色彩+材质+纹理
|
||||
时长：1.5 分钟
|
||||
|
||||
---
|
||||
|
||||
# 03_色彩情绪魔法师
|
||||
|
||||
[过渡] 那我们就从第一个元素——色彩说起。
|
||||
|
||||
色彩是空间给人的第一印象，它就像一位"情绪魔法师"。你走进一个房间，第一个感受到的不是家具的品牌、材料的价格，而是整个空间的色彩氛围。暖色调让你觉得被温柔地包裹着，冷色调则让同样的面积显得更加开阔。 [停顿] 不同的色彩还会触发不同的心理反应——灰绿色让人平静专注，温暖的咖色营造阳光包裹的舒适感，而少量的跳色点缀，则能赋予空间独特的个性。
|
||||
|
||||
要点：① 色彩是第一印象 ② 暖色/冷色的空间效果差异 ③ 色彩的心理反应机制
|
||||
时长：1.5 分钟
|
||||
|
||||
---
|
||||
|
||||
# 04_冷暖色调对比
|
||||
|
||||
[过渡] 为了更直观地理解色彩的力量，我们来看两个对比案例。
|
||||
|
||||
左边这个空间采用了浅色调墙面，可以看到它增大了自然光的反射区域，让整个房间显得非常宽敞明亮。右边则选择了饱和度较高的颜色，同样的面积却给人紧凑、小巧的感觉。 [停顿] 这就是色彩的魔力——同一个空间，仅仅改变色彩，就能带来截然不同的感受。这也是为什么专业设计师在动手之前，总会先确定整体的色彩基调。
|
||||
|
||||
要点：① 浅色调=宽敞效果 ② 高饱和度=紧凑效果 ③ 色彩选择先于其他设计决策
|
||||
时长：1 分钟
|
||||
|
||||
---
|
||||
|
||||
# 05_材质空间语言
|
||||
|
||||
[过渡] 说完色彩，我们来看第二个元素——材质。
|
||||
|
||||
很多人在装修时容易只看重视觉效果，却忽略了材质的重要性。其实，材料是色彩搭配的物理基础。当你走进一个房间，脚下的地板、眼前的墙面、头顶的天花板……都在用各自的"材质语言"和你对话。亚光的原木地板散发质朴与温暖，柔软的手工编织物传递慵懒与松弛。 [停顿] 还有一点很多人会忽略——光，本身也是一种材质。不同材质在光线照射下会呈现截然不同的质感。所以赋予空间高级感，不一定要依赖昂贵的材料，巧妙的照明和光影搭配就能让材质焕发新生。
|
||||
|
||||
要点：① 材质是色彩的物理基础 ② 不同材质传递不同情感 ③ 光也是材质 ④ 不依赖昂贵材料
|
||||
时长：1.5 分钟
|
||||
|
||||
---
|
||||
|
||||
# 06_纹理空间灵魂
|
||||
|
||||
[过渡] 第三个元素是纹理——它往往被认为是最容易被忽视的，但也是最有灵魂的。
|
||||
|
||||
纹理就像空间的"指纹"，赋予了每个空间独一无二的辨识度。我们可以从两个维度来理解它：触觉纹理和视觉纹理。触觉纹理是你能直接感知的——赤脚踩在羊毛地毯上的柔软温暖，手指轻抚粗陶花瓶的凹凸肌理。 [停顿] 而视觉纹理则更微妙——当你看到一幅细腻图案的壁纸时，即便没有触摸，你的眼睛也能"感受"到它的肌理。这两种纹理共同为空间注入了灵魂。
|
||||
|
||||
要点：① 纹理=空间的指纹 ② 触觉纹理的直接感知 ③ 视觉纹理的想象与感受
|
||||
时长：1.5 分钟
|
||||
|
||||
---
|
||||
|
||||
# 07_CMT体系
|
||||
|
||||
[过渡] 了解了色彩、材质、纹理各自的力量之后，一个关键问题来了：如何将这三者有机融合？
|
||||
|
||||
这就引出了今天的核心方法论——CMT体系，即 Colour、Material、Texture 的整合应用。它不是三者的简单叠加，而是一种系统性的编织。 [停顿] 在物理层面，它传递光滑与粗糙、透明与不透明、高光与亚光的触感差异。在心理层面，它唤起手工感或工业感、简朴或奢华、安慰或刺激等丰富的情感联想。就像一位音乐家指挥着交响乐团，让色彩、材质、纹理在空间中和谐共鸣。右边这两个案例就展示了CMT体系的实际应用效果。
|
||||
|
||||
要点：① CMT=色彩+材质+纹理的系统 ② 物理层与心理层的双重感知 ③ 系统性编织而非简单叠加
|
||||
时长：2 分钟
|
||||
|
||||
---
|
||||
|
||||
# 08_奶油风进化论
|
||||
|
||||
[过渡] 有了CMT体系的框架，我们来看看2026年最受欢迎的几种风格是如何运用它的。
|
||||
|
||||
首先是奶油风。它在2026年依然很流行，但正在经历一场深刻的"进化"。以前的奶油风是公式化的——米白色墙面加原木家具，千篇一律。现在则走向了更细腻的表达。 [停顿] 真正高级的奶油风，需要在三个层面同时做文章：颜色基底用奶油色、燕麦色铺陈；材质上加入羊毛、亚麻等质感软装；纹理上保留天然结疤的原木、手工拉坯的陶瓷灯……这些细节的层层叠加，让它真正成为一个可触摸、可感知的治愈空间。
|
||||
|
||||
要点：① 奶油风从公式化到细腻 ② 颜色+材质+纹理三层发力 ③ 治愈空间=可触摸+可感知
|
||||
时长：1.5 分钟
|
||||
|
||||
---
|
||||
|
||||
# 09_波西米亚与复古
|
||||
|
||||
[过渡] 接下来是两种看似不同、但有着共同内核的风格。
|
||||
|
||||
波西米亚风的魅力在于它的自由——大胆的色彩、手工编织的挂毯、民族风的靠垫、带流苏的窗帘……不同纹理之间的碰撞与融合，创造出"有层次的不羁感"。自由，却绝不凌乱。 [停顿] 而怀旧复古风格则用另一种方式打动人心——风化的木材、略带锈迹的熟铁、岁月打磨的柳编……这些带有使用痕迹的材质，本身就是故事的载体。它让家成为安放记忆的容器。两种风格的共同点是什么？是对真实与情感的深切渴望。
|
||||
|
||||
要点：① 波西米亚=自由不羁的纹理碰撞 ② 怀旧复古=时间感的材质载体 ③ 共同内核：对真实的渴望
|
||||
时长：1.5 分钟
|
||||
|
||||
---
|
||||
|
||||
# 10_可持续奢华
|
||||
|
||||
[过渡] 最后一种值得关注的风格，代表了一种全新的价值观。
|
||||
|
||||
2026年的"奢华"正在被重新定义。它不再是昂贵材料的堆砌，而是一种对地球友好、经得起时间考验的"可持续奢华"。 [停顿] 环保饰面材料、最大化利用自然光照、再生木材、软木、黄麻纤维……真正的奢华，正从"炫耀性消费"转向"负责任的审美"。在这样的空间里，我们体验的不只是美，更是一种与世界和谐共存的生活哲学。
|
||||
|
||||
要点：① 奢华的重新定义 ② 可持续材料的创新应用 ③ 从炫耀到负责任的审美转变
|
||||
时长：1.5 分钟
|
||||
|
||||
---
|
||||
|
||||
# 11_书籍推荐
|
||||
|
||||
[过渡] 如果大家想更深入地了解今天分享的这些内容，我强烈推荐一本书。
|
||||
|
||||
《空间的高级感——设计师的色彩、材质、纹理搭配指南》，作者宋文雯老师是清华大学色彩研究所的常务副所长。她创新性地将工业设计领域的CMF概念引入室内设计，构建了我们今天讲的CMT体系。全书分为色彩篇、材料篇、纹理篇和综合篇，是一套"可拆解、可复制、可验证"的空间美学体系。无论你是专业设计师还是即将装修的业主，都能从中获得实用的指导。
|
||||
|
||||
要点：① 书籍核心信息 ② 作者专业背景 ③ 四大内容板块 ④ 适合人群
|
||||
时长：1.5 分钟
|
||||
|
||||
---
|
||||
|
||||
# 12_结语
|
||||
|
||||
[过渡] 让我们回到今天分享的起点。
|
||||
|
||||
2026年的家居趋势，归根到底是让家回归"人的尺度"。色彩是情绪的魔法师，材质是触手可及的语言，纹理是空间灵魂的细节——三者的精妙共鸣，构成了空间的高级感。 [停顿] 希望今天的分享能给大家带来启发。记住，高级感的空间不一定昂贵，但一定有颜值，更有温度与情感。谢谢大家！
|
||||
|
||||
要点：① 三大元素回顾 ② 高级感的本质 ③ 温度与情感的核心价值
|
||||
时长：1 分钟
|
||||
@@ -0,0 +1,79 @@
|
||||
# Execution Lock
|
||||
|
||||
## canvas
|
||||
- viewBox: 0 0 1280 720
|
||||
- format: PPT 16:9
|
||||
|
||||
## colors
|
||||
- bg: #1A1714
|
||||
- secondary_bg: #2A2520
|
||||
- primary: #C4A882
|
||||
- accent: #D4956A
|
||||
- secondary_accent: #8B7355
|
||||
- text: #E8E0D4
|
||||
- text_secondary: #B0A08E
|
||||
- text_tertiary: #7A6E60
|
||||
- border: #3D362E
|
||||
- success: #7BA37B
|
||||
- warning: #C06048
|
||||
|
||||
## typography
|
||||
- font_family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif
|
||||
- title_family: Georgia, SimSun, serif
|
||||
- emphasis_family: Georgia, SimSun, serif
|
||||
- code_family: Consolas, "Courier New", monospace
|
||||
- body: 22
|
||||
- title: 32
|
||||
- subtitle: 28
|
||||
- annotation: 16
|
||||
- cover_title: 80
|
||||
- chapter_title: 48
|
||||
|
||||
## icons
|
||||
- library: tabler-filled
|
||||
- inventory: palette, diamond, paint, home, sun, leaf, sparkles, heart, book, eye, adjustments, star
|
||||
|
||||
## images
|
||||
- intro_living: images/intro_living.png
|
||||
- space_overview: images/space_overview.png
|
||||
- color_wheel: images/color_wheel.png
|
||||
- brown_cozy: images/brown_cozy.png
|
||||
- light_tone_room: images/light_tone_room.png
|
||||
- saturated_room: images/saturated_room.png
|
||||
- material_detail: images/material_detail.png
|
||||
- light_material: images/light_material.png
|
||||
- texture_tactile: images/texture_tactile.png
|
||||
- texture_visual: images/texture_visual.png
|
||||
- cmt_overview: images/cmt_overview.png
|
||||
- cmt_neutral_mix: images/cmt_neutral_mix.png
|
||||
- dark_tone_luxury: images/dark_tone_luxury.png
|
||||
- cream_style: images/cream_style.png
|
||||
- bohemian_style: images/bohemian_style.png
|
||||
- retro_style: images/retro_style.png
|
||||
- sustainable_luxury: images/sustainable_luxury.png
|
||||
- book_cover1: images/book_cover1.png
|
||||
- book_cover2: images/book_cover2.png
|
||||
- book_inside1: images/book_inside1.png
|
||||
- book_inside2: images/book_inside2.png
|
||||
- book_display1: images/book_display1.png
|
||||
- book_display2: images/book_display2.png
|
||||
|
||||
## page_rhythm
|
||||
- P01: anchor
|
||||
- P02: breathing
|
||||
- P03: dense
|
||||
- P04: dense
|
||||
- P05: dense
|
||||
- P06: dense
|
||||
- P07: anchor
|
||||
- P08: breathing
|
||||
- P09: dense
|
||||
- P10: breathing
|
||||
- P11: dense
|
||||
- P12: anchor
|
||||
|
||||
## forbidden
|
||||
- Mixing icon libraries
|
||||
- rgba()
|
||||
- `<style>`, `class`, `<foreignObject>`, `textPath`, `@font-face`, `<animate*>`, `<script>`, `<iframe>`, `<symbol>`+`<use>`
|
||||
- `<g opacity>` (set opacity on each child element individually)
|
||||
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 591 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 409 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 997 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.2 MiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.2 MiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 763 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 1.0 MiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 409 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 2.0 MiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 273 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 3.5 MiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 716 KiB |
@@ -0,0 +1,63 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<linearGradient id="coverOverlay" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0%" stop-color="#1A1714" stop-opacity="0.35"/>
|
||||
<stop offset="40%" stop-color="#1A1714" stop-opacity="0.15"/>
|
||||
<stop offset="65%" stop-color="#1A1714" stop-opacity="0.55"/>
|
||||
<stop offset="100%" stop-color="#1A1714" stop-opacity="0.92"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="titleAccent" x1="0" y1="0" x2="1" y2="0">
|
||||
<stop offset="0%" stop-color="#C4A882"/>
|
||||
<stop offset="100%" stop-color="#D4956A"/>
|
||||
</linearGradient>
|
||||
<filter id="titleGlow" x="-20%" y="-20%" width="140%" height="140%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="6" result="blur"/>
|
||||
<feFlood flood-color="#C4A882" flood-opacity="0.3" result="glowColor"/>
|
||||
<feComposite in="glowColor" in2="blur" operator="in" result="glow"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="glow"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
|
||||
<!-- Background -->
|
||||
<rect width="1280" height="720" fill="#1A1714"/>
|
||||
|
||||
<!-- Hero image -->
|
||||
<image href="../images/intro_living.png" x="0" y="0" width="1280" height="720" preserveAspectRatio="xMidYMid slice"/>
|
||||
|
||||
<!-- Gradient overlay -->
|
||||
<rect x="0" y="0" width="1280" height="720" fill="url(#coverOverlay)"/>
|
||||
|
||||
<!-- Decorative line -->
|
||||
<rect x="80" y="420" width="80" height="3" fill="url(#titleAccent)" rx="1.5"/>
|
||||
|
||||
<!-- Title group -->
|
||||
<g id="cover-title">
|
||||
<text x="80" y="500" font-family="Georgia, SimSun, serif" font-size="72" font-weight="bold" fill="#E8E0D4" filter="url(#titleGlow)">
|
||||
2026 家居趋势
|
||||
</text>
|
||||
<text x="80" y="565" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="26" fill="#C4A882">
|
||||
回归"人的尺度"
|
||||
</text>
|
||||
<text x="80" y="605" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="18" fill="#B0A08E">
|
||||
让色彩、材质与纹理塑造"空间的高级感"
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Bottom info -->
|
||||
<g id="cover-footer">
|
||||
<text x="80" y="668" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#7A6E60">
|
||||
基于《空间的高级感——设计师的色彩、材质、纹理搭配指南》 · 宋文雯 著
|
||||
</text>
|
||||
<text x="1200" y="668" text-anchor="end" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#7A6E60">
|
||||
2026
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Decorative corner elements -->
|
||||
<rect x="60" y="405" width="2" height="50" fill="#C4A882" fill-opacity="0.4"/>
|
||||
<rect x="1200" y="60" width="30" height="2" fill="#C4A882" fill-opacity="0.2"/>
|
||||
<rect x="1218" y="60" width="2" height="30" fill="#C4A882" fill-opacity="0.2"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.8 KiB |
@@ -0,0 +1,73 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<linearGradient id="imgOverlay02" x1="1" y1="0" x2="0" y2="0">
|
||||
<stop offset="0%" stop-color="#1A1714" stop-opacity="0.1"/>
|
||||
<stop offset="40%" stop-color="#1A1714" stop-opacity="0.7"/>
|
||||
<stop offset="100%" stop-color="#1A1714" stop-opacity="0.95"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="accentLine02" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0%" stop-color="#C4A882"/>
|
||||
<stop offset="100%" stop-color="#D4956A"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
|
||||
<!-- Background -->
|
||||
<rect width="1280" height="720" fill="#1A1714"/>
|
||||
|
||||
<!-- Right side image -->
|
||||
<image href="../images/space_overview.png" x="480" y="0" width="800" height="720" preserveAspectRatio="xMidYMid slice"/>
|
||||
<rect x="480" y="0" width="800" height="720" fill="url(#imgOverlay02)"/>
|
||||
|
||||
<!-- Decorative vertical accent line -->
|
||||
<rect x="80" y="180" width="3" height="100" fill="url(#accentLine02)" rx="1.5"/>
|
||||
|
||||
<!-- Chapter number -->
|
||||
<text x="80" y="170" font-family="Georgia, SimSun, serif" font-size="14" fill="#8B7355" letter-spacing="4">
|
||||
CHAPTER 01
|
||||
</text>
|
||||
|
||||
<!-- Title -->
|
||||
<g id="p02-title">
|
||||
<text x="100" y="240" font-family="Georgia, SimSun, serif" font-size="38" font-weight="bold" fill="#E8E0D4">
|
||||
从"网红风"
|
||||
</text>
|
||||
<text x="100" y="290" font-family="Georgia, SimSun, serif" font-size="38" font-weight="bold" fill="#C4A882">
|
||||
到"人的尺度"
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Divider -->
|
||||
<rect x="100" y="315" width="60" height="2" fill="#3D362E"/>
|
||||
|
||||
<!-- Content -->
|
||||
<g id="p02-content">
|
||||
<text x="100" y="360" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="20" fill="#E8E0D4">
|
||||
过去几年，我们见惯了各种家居"网红风"的迅速更迭。
|
||||
</text>
|
||||
<text x="100" y="410" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="20" fill="#B0A08E">
|
||||
到了 2026 年，家居设计正悄然发生一场深刻的转变——
|
||||
</text>
|
||||
<text x="100" y="450" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="20" fill="#B0A08E">
|
||||
从视觉符号的堆砌，回归到对人本身的关怀。
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Quote block -->
|
||||
<rect x="100" y="490" width="4" height="60" fill="#D4956A" rx="2"/>
|
||||
<text x="120" y="515" font-family="Georgia, SimSun, serif" font-size="22" fill="#C4A882" font-style="italic">
|
||||
"高级感的空间，是色彩、材质、纹理
|
||||
</text>
|
||||
<text x="120" y="545" font-family="Georgia, SimSun, serif" font-size="22" fill="#C4A882" font-style="italic">
|
||||
的精妙搭配所营造出来的。"
|
||||
</text>
|
||||
|
||||
<!-- Bottom tagline -->
|
||||
<text x="100" y="620" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#7A6E60">
|
||||
有颜值，更有温度与情感
|
||||
</text>
|
||||
|
||||
<!-- Page number -->
|
||||
<text x="1210" y="690" text-anchor="end" font-family="Georgia, SimSun, serif" font-size="12" fill="#7A6E60">
|
||||
02 / 12
|
||||
</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.0 KiB |
@@ -0,0 +1,101 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<filter id="cardShadow03" x="-15%" y="-15%" width="140%" height="140%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="10"/>
|
||||
<feOffset dx="0" dy="5" result="offsetBlur"/>
|
||||
<feFlood flood-color="#000000" flood-opacity="0.18" result="shadowColor"/>
|
||||
<feComposite in="shadowColor" in2="offsetBlur" operator="in" result="shadow"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="shadow"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
<linearGradient id="accentBar03" x1="0" y1="0" x2="1" y2="0">
|
||||
<stop offset="0%" stop-color="#C4A882"/>
|
||||
<stop offset="100%" stop-color="#D4956A"/>
|
||||
</linearGradient>
|
||||
<clipPath id="colorWheelClip">
|
||||
<rect x="60" y="110" width="420" height="540" rx="16"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
|
||||
<!-- Background -->
|
||||
<rect width="1280" height="720" fill="#1A1714"/>
|
||||
|
||||
<!-- Header -->
|
||||
<g id="p03-header">
|
||||
<use data-icon="tabler-filled/palette" x="60" y="30" width="32" height="32" fill="#D4956A"/>
|
||||
<text x="102" y="56" font-family="Georgia, SimSun, serif" font-size="14" fill="#8B7355" letter-spacing="3">
|
||||
三大底层元素 · 壹
|
||||
</text>
|
||||
<rect x="60" y="75" width="50" height="3" fill="url(#accentBar03)" rx="1.5"/>
|
||||
</g>
|
||||
|
||||
<!-- Left: Color wheel image -->
|
||||
<g id="p03-image">
|
||||
<image href="../images/color_wheel.png" x="60" y="110" width="420" height="540" preserveAspectRatio="xMidYMid slice" clip-path="url(#colorWheelClip)"/>
|
||||
</g>
|
||||
|
||||
<!-- Right content area -->
|
||||
<g id="p03-title">
|
||||
<text x="520" y="155" font-family="Georgia, SimSun, serif" font-size="36" font-weight="bold" fill="#E8E0D4">
|
||||
色彩
|
||||
</text>
|
||||
<text x="520" y="200" font-family="Georgia, SimSun, serif" font-size="26" fill="#C4A882">
|
||||
空间的"情绪魔法师"
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<rect x="520" y="220" width="40" height="2" fill="#3D362E"/>
|
||||
|
||||
<!-- Content points -->
|
||||
<g id="p03-points">
|
||||
<!-- Point 1 -->
|
||||
<g id="p03-point1">
|
||||
<rect x="520" y="248" width="700" height="80" rx="10" fill="#2A2520" filter="url(#cardShadow03)"/>
|
||||
<rect x="520" y="248" width="4" height="80" rx="2" fill="#C4A882"/>
|
||||
<text x="544" y="278" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="20" font-weight="bold" fill="#E8E0D4">
|
||||
第一印象
|
||||
</text>
|
||||
<text x="544" y="308" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
色彩是空间给人的第一印象和最直观的感受
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Point 2 -->
|
||||
<g id="p03-point2">
|
||||
<rect x="520" y="345" width="700" height="80" rx="10" fill="#2A2520" filter="url(#cardShadow03)"/>
|
||||
<rect x="520" y="345" width="4" height="80" rx="2" fill="#D4956A"/>
|
||||
<text x="544" y="375" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="20" font-weight="bold" fill="#E8E0D4">
|
||||
改变视觉尺度
|
||||
</text>
|
||||
<text x="544" y="405" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
暖色调 → 温柔包裹感 ｜ 冷色调 → 开阔冷静
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Point 3 -->
|
||||
<g id="p03-point3">
|
||||
<rect x="520" y="442" width="700" height="80" rx="10" fill="#2A2520" filter="url(#cardShadow03)"/>
|
||||
<rect x="520" y="442" width="4" height="80" rx="2" fill="#8B7355"/>
|
||||
<text x="544" y="472" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="20" font-weight="bold" fill="#E8E0D4">
|
||||
心理反应
|
||||
</text>
|
||||
<text x="544" y="502" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
灰绿 → 平静专注 ｜ 咖色 → 阳光包裹 ｜ 跳色 → 个性活力
|
||||
</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- Small accent image bottom right -->
|
||||
<image href="../images/brown_cozy.png" x="920" y="545" width="300" height="120" preserveAspectRatio="xMidYMid slice"/>
|
||||
<rect x="920" y="545" width="300" height="120" fill="#1A1714" fill-opacity="0.25"/>
|
||||
<text x="935" y="652" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="12" fill="#7A6E60">
|
||||
混色调棕色营造宁静与质朴
|
||||
</text>
|
||||
|
||||
<!-- Page number -->
|
||||
<text x="1210" y="690" text-anchor="end" font-family="Georgia, SimSun, serif" font-size="12" fill="#7A6E60">
|
||||
03 / 12
|
||||
</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.4 KiB |
@@ -0,0 +1,87 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<filter id="imgShadow04" x="-10%" y="-10%" width="130%" height="130%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="8"/>
|
||||
<feOffset dx="0" dy="4" result="offsetBlur"/>
|
||||
<feFlood flood-color="#000000" flood-opacity="0.2" result="shadowColor"/>
|
||||
<feComposite in="shadowColor" in2="offsetBlur" operator="in" result="shadow"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="shadow"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
<clipPath id="leftImgClip04">
|
||||
<rect x="60" y="140" width="560" height="400" rx="12"/>
|
||||
</clipPath>
|
||||
<clipPath id="rightImgClip04">
|
||||
<rect x="660" y="140" width="560" height="400" rx="12"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
|
||||
<!-- Background -->
|
||||
<rect width="1280" height="720" fill="#1A1714"/>
|
||||
|
||||
<!-- Header -->
|
||||
<g id="p04-header">
|
||||
<use data-icon="tabler-filled/palette" x="60" y="30" width="28" height="28" fill="#D4956A"/>
|
||||
<text x="98" y="52" font-family="Georgia, SimSun, serif" font-size="14" fill="#8B7355" letter-spacing="3">
|
||||
色彩实践
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Title -->
|
||||
<text x="60" y="110" font-family="Georgia, SimSun, serif" font-size="32" font-weight="bold" fill="#E8E0D4">
|
||||
冷暖色调的空间效果对比
|
||||
</text>
|
||||
|
||||
<!-- Left image: light tone -->
|
||||
<g id="p04-left" filter="url(#imgShadow04)">
|
||||
<image href="../images/light_tone_room.png" x="60" y="140" width="560" height="400" preserveAspectRatio="xMidYMid slice" clip-path="url(#leftImgClip04)"/>
|
||||
<!-- Label overlay -->
|
||||
<rect x="60" y="480" width="560" height="60" fill="#1A1714" fill-opacity="0.7" rx="0"/>
|
||||
<rect x="60" y="536" width="560" height="4" fill="#1A1714" fill-opacity="0.7" rx="0"/>
|
||||
<text x="90" y="518" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="20" font-weight="bold" fill="#E8E0D4">
|
||||
浅色调
|
||||
</text>
|
||||
<text x="200" y="518" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
增大光线反射，空间显得宽敞
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Right image: saturated -->
|
||||
<g id="p04-right" filter="url(#imgShadow04)">
|
||||
<image href="../images/saturated_room.png" x="660" y="140" width="560" height="400" preserveAspectRatio="xMidYMid slice" clip-path="url(#rightImgClip04)"/>
|
||||
<!-- Label overlay -->
|
||||
<rect x="660" y="480" width="560" height="60" fill="#1A1714" fill-opacity="0.7" rx="0"/>
|
||||
<rect x="660" y="536" width="560" height="4" fill="#1A1714" fill-opacity="0.7" rx="0"/>
|
||||
<text x="690" y="518" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="20" font-weight="bold" fill="#E8E0D4">
|
||||
高饱和度
|
||||
</text>
|
||||
<text x="830" y="518" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
房间紧凑小巧，色彩浓郁
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- VS divider -->
|
||||
<circle cx="640" cy="340" r="24" fill="#2A2520" stroke="#3D362E" stroke-width="2"/>
|
||||
<text x="640" y="347" text-anchor="middle" font-family="Georgia, SimSun, serif" font-size="16" font-weight="bold" fill="#C4A882">
|
||||
VS
|
||||
</text>
|
||||
|
||||
<!-- Bottom insight -->
|
||||
<g id="p04-insight">
|
||||
<rect x="60" y="570" width="1160" height="70" rx="10" fill="#2A2520"/>
|
||||
<rect x="60" y="570" width="4" height="70" rx="2" fill="#D4956A"/>
|
||||
<text x="84" y="598" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="18" fill="#E8E0D4">
|
||||
色彩的魔力：同样的面积，不同色彩让空间感受截然不同
|
||||
</text>
|
||||
<text x="84" y="624" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
灰绿 → 平静专注 ｜ 温暖咖色 → 阳光包裹的舒适感 ｜ 少量跳色 → 独特个性与活力
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Page number -->
|
||||
<text x="1210" y="690" text-anchor="end" font-family="Georgia, SimSun, serif" font-size="12" fill="#7A6E60">
|
||||
04 / 12
|
||||
</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
@@ -0,0 +1,117 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<filter id="cardShadow05" x="-15%" y="-15%" width="140%" height="140%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="10"/>
|
||||
<feOffset dx="0" dy="5" result="offsetBlur"/>
|
||||
<feFlood flood-color="#000000" flood-opacity="0.18" result="shadowColor"/>
|
||||
<feComposite in="shadowColor" in2="offsetBlur" operator="in" result="shadow"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="shadow"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
<clipPath id="mainImgClip05">
|
||||
<rect x="700" y="90" width="530" height="380" rx="14"/>
|
||||
</clipPath>
|
||||
<clipPath id="accentImgClip05">
|
||||
<rect x="700" y="490" width="250" height="170" rx="10"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
|
||||
<!-- Background -->
|
||||
<rect width="1280" height="720" fill="#1A1714"/>
|
||||
|
||||
<!-- Header -->
|
||||
<g id="p05-header">
|
||||
<use data-icon="tabler-filled/diamond" x="60" y="30" width="28" height="28" fill="#D4956A"/>
|
||||
<text x="98" y="52" font-family="Georgia, SimSun, serif" font-size="14" fill="#8B7355" letter-spacing="3">
|
||||
三大底层元素 · 贰
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Title -->
|
||||
<g id="p05-title">
|
||||
<text x="60" y="130" font-family="Georgia, SimSun, serif" font-size="36" font-weight="bold" fill="#E8E0D4">
|
||||
材质
|
||||
</text>
|
||||
<text x="60" y="172" font-family="Georgia, SimSun, serif" font-size="26" fill="#C4A882">
|
||||
触手可及的空间语言
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<rect x="60" y="192" width="40" height="2" fill="#3D362E"/>
|
||||
|
||||
<!-- Left content cards -->
|
||||
<g id="p05-points">
|
||||
<g id="p05-card1">
|
||||
<rect x="60" y="218" width="600" height="72" rx="10" fill="#2A2520" filter="url(#cardShadow05)"/>
|
||||
<rect x="60" y="218" width="4" height="72" rx="2" fill="#C4A882"/>
|
||||
<use data-icon="tabler-filled/sun" x="80" y="236" width="28" height="28" fill="#C4A882"/>
|
||||
<text x="120" y="248" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="18" font-weight="bold" fill="#E8E0D4">
|
||||
物理基础
|
||||
</text>
|
||||
<text x="120" y="274" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
材料决定空间的色彩呈现、光照效果与质感表现
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<g id="p05-card2">
|
||||
<rect x="60" y="308" width="600" height="72" rx="10" fill="#2A2520" filter="url(#cardShadow05)"/>
|
||||
<rect x="60" y="308" width="4" height="72" rx="2" fill="#D4956A"/>
|
||||
<text x="80" y="340" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="18" font-weight="bold" fill="#E8E0D4">
|
||||
材质语言
|
||||
</text>
|
||||
<text x="80" y="366" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
原木 → 质朴温暖 ｜ 手工编织 → 慵懒松弛
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<g id="p05-card3">
|
||||
<rect x="60" y="398" width="600" height="72" rx="10" fill="#2A2520" filter="url(#cardShadow05)"/>
|
||||
<rect x="60" y="398" width="4" height="72" rx="2" fill="#8B7355"/>
|
||||
<text x="80" y="430" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="18" font-weight="bold" fill="#E8E0D4">
|
||||
光 = 一种材质
|
||||
</text>
|
||||
<text x="80" y="456" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
不同材质在光线照射下呈现截然不同的质感
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<g id="p05-card4">
|
||||
<rect x="60" y="488" width="600" height="72" rx="10" fill="#2A2520" filter="url(#cardShadow05)"/>
|
||||
<rect x="60" y="488" width="4" height="72" rx="2" fill="#7BA37B"/>
|
||||
<text x="80" y="520" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="18" font-weight="bold" fill="#E8E0D4">
|
||||
不依赖昂贵
|
||||
</text>
|
||||
<text x="80" y="546" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
巧妙照明 + 色彩光影搭配 → 赋予空间高级感
|
||||
</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- Right: main image -->
|
||||
<g id="p05-main-image">
|
||||
<image href="../images/material_detail.png" x="700" y="90" width="530" height="380" preserveAspectRatio="xMidYMid slice" clip-path="url(#mainImgClip05)"/>
|
||||
</g>
|
||||
|
||||
<!-- Right: accent image -->
|
||||
<g id="p05-accent-image">
|
||||
<image href="../images/light_material.png" x="700" y="490" width="250" height="170" preserveAspectRatio="xMidYMid slice" clip-path="url(#accentImgClip05)"/>
|
||||
<text x="710" y="675" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="12" fill="#7A6E60">
|
||||
光影下的材质质感
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Bottom quote -->
|
||||
<text x="980" y="580" font-family="Georgia, SimSun, serif" font-size="16" fill="#8B7355" font-style="italic">
|
||||
"粗糙变得温柔，
|
||||
</text>
|
||||
<text x="980" y="604" font-family="Georgia, SimSun, serif" font-size="16" fill="#8B7355" font-style="italic">
|
||||
平滑折射出深度"
|
||||
</text>
|
||||
|
||||
<!-- Page number -->
|
||||
<text x="1210" y="690" text-anchor="end" font-family="Georgia, SimSun, serif" font-size="12" fill="#7A6E60">
|
||||
05 / 12
|
||||
</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.1 KiB |
@@ -0,0 +1,102 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<filter id="cardShadow06" x="-15%" y="-15%" width="140%" height="140%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="10"/>
|
||||
<feOffset dx="0" dy="5" result="offsetBlur"/>
|
||||
<feFlood flood-color="#000000" flood-opacity="0.18" result="shadowColor"/>
|
||||
<feComposite in="shadowColor" in2="offsetBlur" operator="in" result="shadow"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="shadow"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
<clipPath id="leftImgClip06">
|
||||
<rect x="60" y="190" width="540" height="310" rx="12"/>
|
||||
</clipPath>
|
||||
<clipPath id="rightImgClip06">
|
||||
<rect x="640" y="190" width="580" height="310" rx="12"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
|
||||
<!-- Background -->
|
||||
<rect width="1280" height="720" fill="#1A1714"/>
|
||||
|
||||
<!-- Header -->
|
||||
<g id="p06-header">
|
||||
<use data-icon="tabler-filled/paint" x="60" y="30" width="28" height="28" fill="#D4956A"/>
|
||||
<text x="98" y="52" font-family="Georgia, SimSun, serif" font-size="14" fill="#8B7355" letter-spacing="3">
|
||||
三大底层元素 · 叁
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Title -->
|
||||
<g id="p06-title">
|
||||
<text x="60" y="120" font-family="Georgia, SimSun, serif" font-size="36" font-weight="bold" fill="#E8E0D4">
|
||||
纹理：赋予空间灵魂的细节
|
||||
</text>
|
||||
<text x="60" y="155" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="18" fill="#B0A08E">
|
||||
纹理，就像是空间的"指纹"——赋予独一无二的辨识度
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Two image comparison -->
|
||||
<!-- Left: tactile texture -->
|
||||
<g id="p06-left-image" filter="url(#cardShadow06)">
|
||||
<image href="../images/texture_tactile.png" x="60" y="190" width="540" height="310" preserveAspectRatio="xMidYMid slice" clip-path="url(#leftImgClip06)"/>
|
||||
<!-- Label -->
|
||||
<rect x="60" y="440" width="540" height="60" fill="#1A1714" fill-opacity="0.75" rx="0"/>
|
||||
<use data-icon="tabler-filled/eye" x="80" y="455" width="24" height="24" fill="#C4A882"/>
|
||||
<text x="114" y="475" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="18" font-weight="bold" fill="#E8E0D4">
|
||||
触觉纹理
|
||||
</text>
|
||||
<text x="240" y="475" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
手指、脚或身体直接感知的表面特征
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Right: visual texture -->
|
||||
<g id="p06-right-image" filter="url(#cardShadow06)">
|
||||
<image href="../images/texture_visual.png" x="640" y="190" width="580" height="310" preserveAspectRatio="xMidYMid slice" clip-path="url(#rightImgClip06)"/>
|
||||
<!-- Label -->
|
||||
<rect x="640" y="440" width="580" height="60" fill="#1A1714" fill-opacity="0.75" rx="0"/>
|
||||
<use data-icon="tabler-filled/eye" x="660" y="455" width="24" height="24" fill="#D4956A"/>
|
||||
<text x="694" y="475" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="18" font-weight="bold" fill="#E8E0D4">
|
||||
视觉纹理
|
||||
</text>
|
||||
<text x="820" y="475" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
由视觉引发的想象与感受
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Bottom examples -->
|
||||
<g id="p06-examples">
|
||||
<rect x="60" y="530" width="560" height="110" rx="10" fill="#2A2520"/>
|
||||
<rect x="60" y="530" width="4" height="110" rx="2" fill="#C4A882"/>
|
||||
<text x="84" y="560" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="17" font-weight="bold" fill="#C4A882">
|
||||
触觉感知
|
||||
</text>
|
||||
<text x="84" y="590" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
赤脚踩在羊毛地毯上 → 柔软温暖
|
||||
</text>
|
||||
<text x="84" y="618" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
手指轻抚粗陶花瓶 → 凹凸不平的肌理
|
||||
</text>
|
||||
|
||||
<rect x="660" y="530" width="560" height="110" rx="10" fill="#2A2520"/>
|
||||
<rect x="660" y="530" width="4" height="110" rx="2" fill="#D4956A"/>
|
||||
<text x="684" y="560" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="17" font-weight="bold" fill="#D4956A">
|
||||
视觉感知
|
||||
</text>
|
||||
<text x="684" y="590" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
细腻图案的壁纸 → 眼睛"感受"到肌理
|
||||
</text>
|
||||
<text x="684" y="618" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
没有触摸，视觉已传递了质感信号
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Page number -->
|
||||
<text x="1210" y="690" text-anchor="end" font-family="Georgia, SimSun, serif" font-size="12" fill="#7A6E60">
|
||||
06 / 12
|
||||
</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.8 KiB |
@@ -0,0 +1,132 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<filter id="ringGlow07" x="-30%" y="-30%" width="160%" height="160%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="8" result="blur"/>
|
||||
<feFlood flood-color="#C4A882" flood-opacity="0.25" result="glowColor"/>
|
||||
<feComposite in="glowColor" in2="blur" operator="in" result="glow"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="glow"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
<filter id="cardShadow07" x="-15%" y="-15%" width="140%" height="140%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="8"/>
|
||||
<feOffset dx="0" dy="4" result="offsetBlur"/>
|
||||
<feFlood flood-color="#000000" flood-opacity="0.15" result="shadowColor"/>
|
||||
<feComposite in="shadowColor" in2="offsetBlur" operator="in" result="shadow"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="shadow"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
<linearGradient id="accentGrad07" x1="0" y1="0" x2="1" y2="0">
|
||||
<stop offset="0%" stop-color="#C4A882"/>
|
||||
<stop offset="100%" stop-color="#D4956A"/>
|
||||
</linearGradient>
|
||||
<radialGradient id="bgGlow07" cx="35%" cy="55%" r="40%">
|
||||
<stop offset="0%" stop-color="#C4A882" stop-opacity="0.06"/>
|
||||
<stop offset="100%" stop-color="#C4A882" stop-opacity="0"/>
|
||||
</radialGradient>
|
||||
</defs>
|
||||
|
||||
<!-- Background -->
|
||||
<rect width="1280" height="720" fill="#1A1714"/>
|
||||
<rect width="1280" height="720" fill="url(#bgGlow07)"/>
|
||||
|
||||
<!-- Header -->
|
||||
<g id="p07-header">
|
||||
<use data-icon="tabler-filled/sparkles" x="60" y="25" width="28" height="28" fill="#D4956A"/>
|
||||
<text x="98" y="47" font-family="Georgia, SimSun, serif" font-size="14" fill="#8B7355" letter-spacing="3">
|
||||
核心方法论
|
||||
</text>
|
||||
<text x="60" y="85" font-family="Georgia, SimSun, serif" font-size="32" font-weight="bold" fill="#E8E0D4">
|
||||
CMT 体系
|
||||
</text>
|
||||
<text x="240" y="85" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="20" fill="#C4A882">
|
||||
编织全方位感官体验
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Concentric circles (center at 340, 400) -->
|
||||
<!-- Outer ring: Texture -->
|
||||
<circle cx="340" cy="410" r="230" fill="#D4956A" fill-opacity="0.06" stroke="#D4956A" stroke-width="1.5" stroke-opacity="0.2"/>
|
||||
<text x="340" y="200" text-anchor="middle" font-family="Georgia, SimSun, serif" font-size="14" font-weight="bold" fill="#D4956A" fill-opacity="0.7">
|
||||
纹理 Texture
|
||||
</text>
|
||||
|
||||
<!-- Middle ring: Material -->
|
||||
<circle cx="340" cy="410" r="155" fill="#C4A882" fill-opacity="0.08" stroke="#C4A882" stroke-width="1.5" stroke-opacity="0.25"/>
|
||||
<text x="340" y="272" text-anchor="middle" font-family="Georgia, SimSun, serif" font-size="14" font-weight="bold" fill="#C4A882" fill-opacity="0.8">
|
||||
材质 Material
|
||||
</text>
|
||||
|
||||
<!-- Inner core: Colour -->
|
||||
<circle cx="340" cy="410" r="75" fill="#C4A882" filter="url(#ringGlow07)"/>
|
||||
<text x="340" y="402" text-anchor="middle" font-family="Georgia, SimSun, serif" font-size="20" font-weight="bold" fill="#1A1714">
|
||||
色彩
|
||||
</text>
|
||||
<text x="340" y="425" text-anchor="middle" font-family="Georgia, SimSun, serif" font-size="14" fill="#2A2520">
|
||||
Colour
|
||||
</text>
|
||||
|
||||
<!-- Right side: explanation cards -->
|
||||
<g id="p07-card-physical" filter="url(#cardShadow07)">
|
||||
<rect x="650" y="120" width="580" height="105" rx="12" fill="#2A2520"/>
|
||||
<rect x="650" y="120" width="5" height="105" rx="2" fill="#C4A882"/>
|
||||
<text x="675" y="152" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="18" font-weight="bold" fill="#C4A882">
|
||||
物理层感知
|
||||
</text>
|
||||
<text x="675" y="180" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
光滑 / 粗糙 · 透明 / 不透明 · 高光 / 亚光
|
||||
</text>
|
||||
<text x="675" y="206" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
柔软 / 坚硬 · 温暖 / 冰冷 · 轻盈 / 沉重
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<g id="p07-card-psychological" filter="url(#cardShadow07)">
|
||||
<rect x="650" y="245" width="580" height="105" rx="12" fill="#2A2520"/>
|
||||
<rect x="650" y="245" width="5" height="105" rx="2" fill="#D4956A"/>
|
||||
<text x="675" y="277" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="18" font-weight="bold" fill="#D4956A">
|
||||
心理层联想
|
||||
</text>
|
||||
<text x="675" y="305" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
手工感 / 工业感 · 简朴 / 奢华 · 亲近 / 疏离
|
||||
</text>
|
||||
<text x="675" y="331" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
安慰 / 刺激 · 放松 / 兴奋 · 传统 / 现代
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Case images -->
|
||||
<g id="p07-case-images">
|
||||
<image href="../images/cmt_neutral_mix.png" x="650" y="375" width="280" height="155" preserveAspectRatio="xMidYMid slice"/>
|
||||
<rect x="650" y="375" width="280" height="155" fill="#1A1714" fill-opacity="0.15"/>
|
||||
<text x="660" y="520" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="12" fill="#7A6E60">
|
||||
中性色 + 多材质层次
|
||||
</text>
|
||||
|
||||
<image href="../images/dark_tone_luxury.png" x="950" y="375" width="280" height="155" preserveAspectRatio="xMidYMid slice"/>
|
||||
<rect x="950" y="375" width="280" height="155" fill="#1A1714" fill-opacity="0.15"/>
|
||||
<text x="960" y="520" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="12" fill="#7A6E60">
|
||||
深色调 + 镜面材质对比
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Bottom quote -->
|
||||
<g id="p07-quote">
|
||||
<rect x="650" y="555" width="580" height="80" rx="10" fill="#2A2520"/>
|
||||
<rect x="650" y="555" width="580" height="3" rx="1" fill="url(#accentGrad07)"/>
|
||||
<text x="670" y="585" font-family="Georgia, SimSun, serif" font-size="17" fill="#C4A882" font-style="italic">
|
||||
"CMT 不是三者的简单叠加，
|
||||
</text>
|
||||
<text x="670" y="612" font-family="Georgia, SimSun, serif" font-size="17" fill="#C4A882" font-style="italic">
|
||||
而是一位指挥家，让色彩、材质、纹理在空间中和谐共鸣"
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Page number -->
|
||||
<text x="1210" y="690" text-anchor="end" font-family="Georgia, SimSun, serif" font-size="12" fill="#7A6E60">
|
||||
07 / 12
|
||||
</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.3 KiB |
@@ -0,0 +1,83 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<linearGradient id="imgOverlay08" x1="0" y1="0" x2="1" y2="0">
|
||||
<stop offset="0%" stop-color="#1A1714" stop-opacity="0.92"/>
|
||||
<stop offset="50%" stop-color="#1A1714" stop-opacity="0.6"/>
|
||||
<stop offset="100%" stop-color="#1A1714" stop-opacity="0.15"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="tagGrad08" x1="0" y1="0" x2="1" y2="0">
|
||||
<stop offset="0%" stop-color="#C4A882"/>
|
||||
<stop offset="100%" stop-color="#D4956A"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
|
||||
<!-- Background -->
|
||||
<rect width="1280" height="720" fill="#1A1714"/>
|
||||
|
||||
<!-- Right side image -->
|
||||
<image href="../images/cream_style.png" x="400" y="0" width="880" height="720" preserveAspectRatio="xMidYMid slice"/>
|
||||
<rect x="400" y="0" width="880" height="720" fill="url(#imgOverlay08)"/>
|
||||
|
||||
<!-- Chapter tag -->
|
||||
<g id="p08-tag">
|
||||
<use data-icon="tabler-filled/star" x="60" y="100" width="24" height="24" fill="#D4956A"/>
|
||||
<text x="92" y="118" font-family="Georgia, SimSun, serif" font-size="14" fill="#8B7355" letter-spacing="3">
|
||||
2026 流行风格
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Title -->
|
||||
<g id="p08-title">
|
||||
<text x="60" y="195" font-family="Georgia, SimSun, serif" font-size="42" font-weight="bold" fill="#E8E0D4">
|
||||
奶油风 2.0
|
||||
</text>
|
||||
<text x="60" y="240" font-family="Georgia, SimSun, serif" font-size="24" fill="#C4A882">
|
||||
从公式化到细腻表达
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Vertical accent -->
|
||||
<rect x="60" y="265" width="60" height="3" fill="url(#tagGrad08)" rx="1.5"/>
|
||||
|
||||
<!-- Content -->
|
||||
<g id="p08-content">
|
||||
<text x="60" y="310" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="19" fill="#E8E0D4">
|
||||
不再只是"米白色墙面 + 原木家具"的公式
|
||||
</text>
|
||||
|
||||
<text x="60" y="365" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#C4A882" font-weight="bold">
|
||||
颜色基底
|
||||
</text>
|
||||
<text x="60" y="392" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
奶油色 · 燕麦色 · 米白色 — 温暖中性色铺陈
|
||||
</text>
|
||||
|
||||
<text x="60" y="435" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#D4956A" font-weight="bold">
|
||||
材质点睛
|
||||
</text>
|
||||
<text x="60" y="462" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
羊毛 · 亚麻 · 天然结疤原木 · 手工拉坯陶瓷
|
||||
</text>
|
||||
|
||||
<text x="60" y="505" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#8B7355" font-weight="bold">
|
||||
纹理叠加
|
||||
</text>
|
||||
<text x="60" y="532" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
细节层层叠加，脱离"廉价网红感"
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Bottom emphasis -->
|
||||
<rect x="60" y="575" width="4" height="50" fill="#D4956A" rx="2"/>
|
||||
<text x="78" y="598" font-family="Georgia, SimSun, serif" font-size="20" fill="#E8E0D4" font-style="italic">
|
||||
真正的治愈空间
|
||||
</text>
|
||||
<text x="78" y="622" font-family="Georgia, SimSun, serif" font-size="16" fill="#8B7355" font-style="italic">
|
||||
可触摸 · 可感知
|
||||
</text>
|
||||
|
||||
<!-- Page number -->
|
||||
<text x="1210" y="690" text-anchor="end" font-family="Georgia, SimSun, serif" font-size="12" fill="#7A6E60">
|
||||
08 / 12
|
||||
</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.4 KiB |
@@ -0,0 +1,133 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<filter id="cardShadow09" x="-15%" y="-15%" width="140%" height="140%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="10"/>
|
||||
<feOffset dx="0" dy="5" result="offsetBlur"/>
|
||||
<feFlood flood-color="#000000" flood-opacity="0.18" result="shadowColor"/>
|
||||
<feComposite in="shadowColor" in2="offsetBlur" operator="in" result="shadow"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="shadow"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
<clipPath id="leftImgClip09">
|
||||
<rect x="60" y="130" width="380" height="450" rx="12"/>
|
||||
</clipPath>
|
||||
<clipPath id="rightImgClip09">
|
||||
<rect x="710" y="130" width="510" height="290" rx="12"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
|
||||
<!-- Background -->
|
||||
<rect width="1280" height="720" fill="#1A1714"/>
|
||||
|
||||
<!-- Header -->
|
||||
<g id="p09-header">
|
||||
<use data-icon="tabler-filled/star" x="60" y="25" width="24" height="24" fill="#D4956A"/>
|
||||
<text x="92" y="44" font-family="Georgia, SimSun, serif" font-size="14" fill="#8B7355" letter-spacing="3">
|
||||
2026 流行风格
|
||||
</text>
|
||||
<text x="60" y="95" font-family="Georgia, SimSun, serif" font-size="32" font-weight="bold" fill="#E8E0D4">
|
||||
自由灵魂与时间记忆
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Left: Bohemian image (portrait) -->
|
||||
<g id="p09-bohemian" filter="url(#cardShadow09)">
|
||||
<image href="../images/bohemian_style.png" x="60" y="130" width="380" height="450" preserveAspectRatio="xMidYMid slice" clip-path="url(#leftImgClip09)"/>
|
||||
<rect x="60" y="510" width="380" height="70" fill="#1A1714" fill-opacity="0.75"/>
|
||||
<text x="80" y="543" font-family="Georgia, SimSun, serif" font-size="20" font-weight="bold" fill="#D4956A">
|
||||
波西米亚风
|
||||
</text>
|
||||
<text x="80" y="568" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#B0A08E">
|
||||
有层次的不羁感
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Middle: Bohemian description -->
|
||||
<g id="p09-bohemian-desc">
|
||||
<rect x="470" y="130" width="210" height="450" rx="10" fill="#2A2520"/>
|
||||
<rect x="470" y="130" width="210" height="4" rx="2" fill="#D4956A"/>
|
||||
<text x="490" y="170" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#D4956A" font-weight="bold">
|
||||
波西米亚
|
||||
</text>
|
||||
<text x="490" y="200" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
大胆色彩
|
||||
</text>
|
||||
<text x="490" y="225" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
自由织物组合
|
||||
</text>
|
||||
<text x="490" y="250" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
手工编织挂毯
|
||||
</text>
|
||||
<text x="490" y="275" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
民族风靠垫
|
||||
</text>
|
||||
<text x="490" y="300" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
流苏窗帘灯罩
|
||||
</text>
|
||||
<rect x="490" y="325" width="170" height="1" fill="#3D362E"/>
|
||||
<text x="490" y="355" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#C4A882" font-weight="bold">
|
||||
怀旧复古
|
||||
</text>
|
||||
<text x="490" y="385" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
风化木材
|
||||
</text>
|
||||
<text x="490" y="410" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
略带锈迹的熟铁
|
||||
</text>
|
||||
<text x="490" y="435" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
岁月打磨的柳编
|
||||
</text>
|
||||
<text x="490" y="460" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
棉质面料 · 柔和色调
|
||||
</text>
|
||||
<text x="490" y="495" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#7A6E60">
|
||||
材质本身就是
|
||||
</text>
|
||||
<text x="490" y="518" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#7A6E60">
|
||||
故事的载体
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Right: Retro image -->
|
||||
<g id="p09-retro" filter="url(#cardShadow09)">
|
||||
<image href="../images/retro_style.png" x="710" y="130" width="510" height="290" preserveAspectRatio="xMidYMid slice" clip-path="url(#rightImgClip09)"/>
|
||||
<rect x="710" y="355" width="510" height="65" fill="#1A1714" fill-opacity="0.75"/>
|
||||
<text x="730" y="388" font-family="Georgia, SimSun, serif" font-size="20" font-weight="bold" fill="#C4A882">
|
||||
怀旧复古风
|
||||
</text>
|
||||
<text x="730" y="410" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#B0A08E">
|
||||
加入个人记忆的重新演绎
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Bottom shared insight -->
|
||||
<g id="p09-insight">
|
||||
<rect x="710" y="450" width="510" height="130" rx="10" fill="#2A2520"/>
|
||||
<rect x="710" y="450" width="510" height="3" fill="#8B7355"/>
|
||||
<text x="730" y="485" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="17" font-weight="bold" fill="#E8E0D4">
|
||||
共同特点
|
||||
</text>
|
||||
<text x="730" y="515" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
对真实与情感的深切渴望
|
||||
</text>
|
||||
<text x="730" y="545" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#B0A08E">
|
||||
让家成为安放记忆的容器
|
||||
</text>
|
||||
<text x="730" y="568" font-family="Georgia, SimSun, serif" font-size="14" fill="#8B7355" font-style="italic">
|
||||
"自由，却绝不凌乱"
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Page number -->
|
||||
<text x="1210" y="690" text-anchor="end" font-family="Georgia, SimSun, serif" font-size="12" fill="#7A6E60">
|
||||
09 / 12
|
||||
</text>
|
||||
|
||||
<!-- Footer line -->
|
||||
<rect x="60" y="660" width="1160" height="1" fill="#3D362E"/>
|
||||
<text x="60" y="690" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="12" fill="#7A6E60">
|
||||
图源：《空间的高级感》· unsplash
|
||||
</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.2 KiB |
@@ -0,0 +1,81 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<linearGradient id="imgOverlay10" x1="1" y1="0" x2="0" y2="0">
|
||||
<stop offset="0%" stop-color="#1A1714" stop-opacity="0.05"/>
|
||||
<stop offset="35%" stop-color="#1A1714" stop-opacity="0.5"/>
|
||||
<stop offset="100%" stop-color="#1A1714" stop-opacity="0.95"/>
|
||||
</linearGradient>
|
||||
<radialGradient id="bgAccent10" cx="85%" cy="50%" r="45%">
|
||||
<stop offset="0%" stop-color="#7BA37B" stop-opacity="0.06"/>
|
||||
<stop offset="100%" stop-color="#7BA37B" stop-opacity="0"/>
|
||||
</radialGradient>
|
||||
</defs>
|
||||
|
||||
<!-- Background -->
|
||||
<rect width="1280" height="720" fill="#1A1714"/>
|
||||
<rect width="1280" height="720" fill="url(#bgAccent10)"/>
|
||||
|
||||
<!-- Right side image -->
|
||||
<image href="../images/sustainable_luxury.png" x="680" y="0" width="600" height="720" preserveAspectRatio="xMidYMid slice"/>
|
||||
<rect x="680" y="0" width="600" height="720" fill="url(#imgOverlay10)"/>
|
||||
|
||||
<!-- Tag -->
|
||||
<g id="p10-tag">
|
||||
<use data-icon="tabler-filled/leaf" x="80" y="120" width="28" height="28" fill="#7BA37B"/>
|
||||
<text x="116" y="140" font-family="Georgia, SimSun, serif" font-size="14" fill="#7BA37B" letter-spacing="3">
|
||||
2026 流行风格
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Title -->
|
||||
<g id="p10-title">
|
||||
<text x="80" y="210" font-family="Georgia, SimSun, serif" font-size="42" font-weight="bold" fill="#E8E0D4">
|
||||
可持续奢华
|
||||
</text>
|
||||
<text x="80" y="250" font-family="Georgia, SimSun, serif" font-size="22" fill="#7BA37B">
|
||||
负责任的审美
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Vertical accent -->
|
||||
<rect x="80" y="275" width="50" height="3" fill="#7BA37B" rx="1.5"/>
|
||||
|
||||
<!-- Content -->
|
||||
<g id="p10-content">
|
||||
<text x="80" y="320" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="19" fill="#E8E0D4">
|
||||
奢华不再是昂贵材料的堆砌
|
||||
</text>
|
||||
|
||||
<text x="80" y="370" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
● 环保饰面材料
|
||||
</text>
|
||||
<text x="80" y="398" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
● 最大化利用自然光照
|
||||
</text>
|
||||
<text x="80" y="426" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
● 再生木材 · 软木 · 黄麻纤维
|
||||
</text>
|
||||
<text x="80" y="454" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
● 本地化可持续木材 · 植物染料回归
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Bottom quote -->
|
||||
<rect x="80" y="500" width="4" height="70" fill="#7BA37B" rx="2"/>
|
||||
<text x="100" y="530" font-family="Georgia, SimSun, serif" font-size="20" fill="#E8E0D4" font-style="italic">
|
||||
从"炫耀性消费"
|
||||
</text>
|
||||
<text x="100" y="558" font-family="Georgia, SimSun, serif" font-size="20" fill="#7BA37B" font-style="italic">
|
||||
转向"负责任的审美"
|
||||
</text>
|
||||
|
||||
<!-- Closing thought -->
|
||||
<text x="80" y="630" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#7A6E60">
|
||||
与世界和谐共存的生活哲学
|
||||
</text>
|
||||
|
||||
<!-- Page number -->
|
||||
<text x="1210" y="690" text-anchor="end" font-family="Georgia, SimSun, serif" font-size="12" fill="#7A6E60">
|
||||
10 / 12
|
||||
</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.3 KiB |
@@ -0,0 +1,136 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<filter id="cardShadow11" x="-15%" y="-15%" width="140%" height="140%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="10"/>
|
||||
<feOffset dx="0" dy="5" result="offsetBlur"/>
|
||||
<feFlood flood-color="#000000" flood-opacity="0.18" result="shadowColor"/>
|
||||
<feComposite in="shadowColor" in2="offsetBlur" operator="in" result="shadow"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="shadow"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
<clipPath id="bookClip1">
|
||||
<rect x="60" y="160" width="360" height="260" rx="10"/>
|
||||
</clipPath>
|
||||
<clipPath id="bookClip2">
|
||||
<rect x="60" y="440" width="360" height="200" rx="10"/>
|
||||
</clipPath>
|
||||
<clipPath id="bookClip3">
|
||||
<rect x="440" y="440" width="380" height="200" rx="10"/>
|
||||
</clipPath>
|
||||
<clipPath id="bookClip4">
|
||||
<rect x="840" y="440" width="380" height="200" rx="10"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
|
||||
<!-- Background -->
|
||||
<rect width="1280" height="720" fill="#1A1714"/>
|
||||
|
||||
<!-- Header -->
|
||||
<g id="p11-header">
|
||||
<use data-icon="tabler-filled/book" x="60" y="25" width="28" height="28" fill="#D4956A"/>
|
||||
<text x="98" y="47" font-family="Georgia, SimSun, serif" font-size="14" fill="#8B7355" letter-spacing="3">
|
||||
推荐阅读
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Title -->
|
||||
<text x="60" y="110" font-family="Georgia, SimSun, serif" font-size="28" font-weight="bold" fill="#E8E0D4">
|
||||
《空间的高级感》
|
||||
</text>
|
||||
<text x="60" y="140" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#B0A08E">
|
||||
可拆解、可复制、可验证的空间美学体系
|
||||
</text>
|
||||
|
||||
<!-- Main book cover image -->
|
||||
<g id="p11-book-cover" filter="url(#cardShadow11)">
|
||||
<image href="../images/book_cover1.png" x="60" y="160" width="360" height="260" preserveAspectRatio="xMidYMid slice" clip-path="url(#bookClip1)"/>
|
||||
</g>
|
||||
|
||||
<!-- Author & info card -->
|
||||
<g id="p11-author-card" filter="url(#cardShadow11)">
|
||||
<rect x="440" y="160" width="380" height="260" rx="12" fill="#2A2520"/>
|
||||
<rect x="440" y="160" width="380" height="4" rx="2" fill="#C4A882"/>
|
||||
|
||||
<text x="465" y="200" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" font-weight="bold" fill="#C4A882">
|
||||
作者
|
||||
</text>
|
||||
<text x="465" y="228" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#E8E0D4">
|
||||
宋文雯
|
||||
</text>
|
||||
<text x="465" y="253" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#B0A08E">
|
||||
清华大学艺术与科学研究中心
|
||||
</text>
|
||||
<text x="465" y="273" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#B0A08E">
|
||||
色彩研究所常务副所长
|
||||
</text>
|
||||
<text x="465" y="293" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#B0A08E">
|
||||
英国利兹大学色彩学硕士
|
||||
</text>
|
||||
|
||||
<rect x="465" y="310" width="330" height="1" fill="#3D362E"/>
|
||||
|
||||
<text x="465" y="338" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" font-weight="bold" fill="#D4956A">
|
||||
核心创新
|
||||
</text>
|
||||
<text x="465" y="365" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
将工业设计 CMF 引入室内设计
|
||||
</text>
|
||||
<text x="465" y="390" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#B0A08E">
|
||||
提出 CMT 体系方法论
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Content chapters card -->
|
||||
<g id="p11-chapters-card" filter="url(#cardShadow11)">
|
||||
<rect x="840" y="160" width="380" height="260" rx="12" fill="#2A2520"/>
|
||||
<rect x="840" y="160" width="380" height="4" rx="2" fill="#8B7355"/>
|
||||
|
||||
<text x="865" y="200" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" font-weight="bold" fill="#E8E0D4">
|
||||
全书内容
|
||||
</text>
|
||||
|
||||
<circle cx="880" cy="235" r="12" fill="#C4A882"/>
|
||||
<text x="880" y="240" text-anchor="middle" font-family="Georgia, SimSun, serif" font-size="12" font-weight="bold" fill="#1A1714">1</text>
|
||||
<text x="902" y="241" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#E8E0D4">色彩篇</text>
|
||||
<text x="975" y="241" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#7A6E60">颜色本质·情感·搭配</text>
|
||||
|
||||
<circle cx="880" cy="275" r="12" fill="#D4956A"/>
|
||||
<text x="880" y="280" text-anchor="middle" font-family="Georgia, SimSun, serif" font-size="12" font-weight="bold" fill="#1A1714">2</text>
|
||||
<text x="902" y="281" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#E8E0D4">材料篇</text>
|
||||
<text x="975" y="281" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#7A6E60">木材·金属·织物·塑料</text>
|
||||
|
||||
<circle cx="880" cy="315" r="12" fill="#8B7355"/>
|
||||
<text x="880" y="320" text-anchor="middle" font-family="Georgia, SimSun, serif" font-size="12" font-weight="bold" fill="#1A1714">3</text>
|
||||
<text x="902" y="321" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#E8E0D4">纹理篇</text>
|
||||
<text x="975" y="321" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#7A6E60">纹理语言·图案表达</text>
|
||||
|
||||
<circle cx="880" cy="355" r="12" fill="#7BA37B"/>
|
||||
<text x="880" y="360" text-anchor="middle" font-family="Georgia, SimSun, serif" font-size="12" font-weight="bold" fill="#1A1714">4</text>
|
||||
<text x="902" y="361" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="15" fill="#E8E0D4">综合篇</text>
|
||||
<text x="975" y="361" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#7A6E60">CMT搭配·风格解析</text>
|
||||
|
||||
<rect x="865" y="385" width="330" height="1" fill="#3D362E"/>
|
||||
<text x="865" y="408" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#7A6E60">
|
||||
适合：设计师提升 / 装修业主自学
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Bottom image strip -->
|
||||
<g id="p11-book-images">
|
||||
<image href="../images/book_cover2.png" x="60" y="440" width="360" height="200" preserveAspectRatio="xMidYMid slice" clip-path="url(#bookClip2)"/>
|
||||
<image href="../images/book_inside1.png" x="440" y="440" width="380" height="200" preserveAspectRatio="xMidYMid slice" clip-path="url(#bookClip3)"/>
|
||||
<image href="../images/book_inside2.png" x="840" y="440" width="380" height="200" preserveAspectRatio="xMidYMid slice" clip-path="url(#bookClip4)"/>
|
||||
</g>
|
||||
|
||||
<!-- Bottom caption -->
|
||||
<text x="60" y="660" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="12" fill="#7A6E60">
|
||||
出版社：江苏凤凰科学技术出版社
|
||||
</text>
|
||||
|
||||
<!-- Page number -->
|
||||
<text x="1210" y="690" text-anchor="end" font-family="Georgia, SimSun, serif" font-size="12" fill="#7A6E60">
|
||||
11 / 12
|
||||
</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 7.0 KiB |
@@ -0,0 +1,112 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<linearGradient id="endGrad" x1="0" y1="0" x2="1" y2="0">
|
||||
<stop offset="0%" stop-color="#C4A882"/>
|
||||
<stop offset="100%" stop-color="#D4956A"/>
|
||||
</linearGradient>
|
||||
<filter id="endGlow" x="-20%" y="-20%" width="140%" height="140%">
|
||||
<feGaussianBlur in="SourceAlpha" stdDeviation="6" result="blur"/>
|
||||
<feFlood flood-color="#C4A882" flood-opacity="0.25" result="glowColor"/>
|
||||
<feComposite in="glowColor" in2="blur" operator="in" result="glow"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="glow"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
<radialGradient id="bgGlow12" cx="50%" cy="45%" r="50%">
|
||||
<stop offset="0%" stop-color="#C4A882" stop-opacity="0.05"/>
|
||||
<stop offset="100%" stop-color="#C4A882" stop-opacity="0"/>
|
||||
</radialGradient>
|
||||
<clipPath id="bookDispClip1">
|
||||
<rect x="730" y="180" width="230" height="320" rx="10"/>
|
||||
</clipPath>
|
||||
<clipPath id="bookDispClip2">
|
||||
<rect x="980" y="180" width="230" height="320" rx="10"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
|
||||
<!-- Background -->
|
||||
<rect width="1280" height="720" fill="#1A1714"/>
|
||||
<rect width="1280" height="720" fill="url(#bgGlow12)"/>
|
||||
|
||||
<!-- Decorative elements -->
|
||||
<rect x="80" y="160" width="3" height="120" fill="#C4A882" fill-opacity="0.3"/>
|
||||
<circle cx="81" cy="155" r="4" fill="#C4A882" fill-opacity="0.4"/>
|
||||
|
||||
<!-- Main title -->
|
||||
<g id="p12-title">
|
||||
<text x="110" y="220" font-family="Georgia, SimSun, serif" font-size="48" font-weight="bold" fill="#E8E0D4" filter="url(#endGlow)">
|
||||
让家回归
|
||||
</text>
|
||||
<text x="110" y="280" font-family="Georgia, SimSun, serif" font-size="48" font-weight="bold" fill="url(#endGrad)">
|
||||
"人的尺度"
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Divider -->
|
||||
<rect x="110" y="305" width="80" height="3" fill="url(#endGrad)" rx="1.5"/>
|
||||
|
||||
<!-- Core message -->
|
||||
<g id="p12-message">
|
||||
<text x="110" y="360" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="20" fill="#E8E0D4">
|
||||
高级感的本质
|
||||
</text>
|
||||
<text x="110" y="400" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="18" fill="#B0A08E">
|
||||
色彩、材质、纹理的精妙共鸣
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Three keywords -->
|
||||
<g id="p12-keywords">
|
||||
<use data-icon="tabler-filled/palette" x="110" y="440" width="24" height="24" fill="#C4A882"/>
|
||||
<text x="142" y="458" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#C4A882">色彩</text>
|
||||
<text x="192" y="458" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#7A6E60">· 情绪魔法师</text>
|
||||
|
||||
<use data-icon="tabler-filled/diamond" x="110" y="476" width="24" height="24" fill="#D4956A"/>
|
||||
<text x="142" y="494" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#D4956A">材质</text>
|
||||
<text x="192" y="494" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#7A6E60">· 触手可及的语言</text>
|
||||
|
||||
<use data-icon="tabler-filled/paint" x="110" y="512" width="24" height="24" fill="#8B7355"/>
|
||||
<text x="142" y="530" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="16" fill="#8B7355">纹理</text>
|
||||
<text x="192" y="530" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="14" fill="#7A6E60">· 空间灵魂的细节</text>
|
||||
</g>
|
||||
|
||||
<!-- Heart icon + closing -->
|
||||
<g id="p12-closing">
|
||||
<use data-icon="tabler-filled/heart" x="110" y="570" width="20" height="20" fill="#C06048"/>
|
||||
<text x="138" y="586" font-family="Georgia, SimSun, serif" font-size="18" fill="#E8E0D4" font-style="italic">
|
||||
有颜值，更有温度与情感
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Right side: book display images -->
|
||||
<g id="p12-book-images">
|
||||
<image href="../images/book_display1.png" x="730" y="180" width="230" height="320" preserveAspectRatio="xMidYMid slice" clip-path="url(#bookDispClip1)"/>
|
||||
<image href="../images/book_display2.png" x="980" y="180" width="230" height="320" preserveAspectRatio="xMidYMid slice" clip-path="url(#bookDispClip2)"/>
|
||||
</g>
|
||||
|
||||
<!-- Source reference -->
|
||||
<text x="730" y="530" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#7A6E60">
|
||||
参考来源
|
||||
</text>
|
||||
<text x="730" y="555" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#B0A08E">
|
||||
《空间的高级感——设计师的色彩、
|
||||
</text>
|
||||
<text x="730" y="575" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="13" fill="#B0A08E">
|
||||
材质、纹理搭配指南》
|
||||
</text>
|
||||
<text x="730" y="600" font-family="'Microsoft YaHei', 'PingFang SC', Arial, sans-serif" font-size="12" fill="#7A6E60">
|
||||
著者：宋文雯 · 江苏凤凰科学技术出版社
|
||||
</text>
|
||||
|
||||
<!-- Footer -->
|
||||
<rect x="60" y="660" width="1160" height="1" fill="#3D362E"/>
|
||||
<text x="640" y="690" text-anchor="middle" font-family="Georgia, SimSun, serif" font-size="13" fill="#7A6E60">
|
||||
谢谢观看 · Thank You
|
||||
</text>
|
||||
|
||||
<!-- Page number -->
|
||||
<text x="1210" y="690" text-anchor="end" font-family="Georgia, SimSun, serif" font-size="12" fill="#7A6E60">
|
||||
12 / 12
|
||||
</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.3 KiB |
Reference in New Issue
Block a user