🎨简约典雅艺术网页
将内容转化为艺术化的手绘风格网页。精致的线条插画与配色，让你的信息充满温度与品味。
精选自
Lynne Lau
为什么我们推荐这个技能
这款技能能将您的内容转化为简约典雅的艺术手绘风格网页，完美融合现代数字设计与传统美学。它能根据您的需求，智能生成定制插画，并运用精致的色彩与字体系统，打造充满艺术感和品牌温度的网页，让您的产品或服务在视觉上脱颖而出。
指令
根据用户给到的内容做成网页，网页风格要求如下：
### 一、视觉风格定位 - **艺术化手绘风格**: 采用线条插画(line art)风格,融合现代数字设计与传统手绘美学 - **配色策略**: 以中性色(米白/浅灰)为基底,搭配深灰色主文字,使用橙红色(accent color)作为视觉焦点色 - - **品牌调性**: 精致、文艺、有温度,面向有品味的目标用户群体 - ### 二、布局架构原则 **Hero Section(首屏设计)** - - 左右分栏布局(60:40 黄金比例) - - 左侧: - - 超大号标题(Display Font, 72-96px),深色字体,强烈视觉冲击 - - 关键数据用accent色高亮(如"15 Cities, 4749 locations") - - 副标题文案简洁有力,阐述核心价值主张 - - 大量留白,营造高端感 - - - 右侧: - - 定制化手绘插画,占据50%视觉空间 - - 插画风格统一:线条勾勒+局部色彩点缀 - - 插画内容与品牌故事深度契合 - - **导航栏设计** - - 极简化顶部导航,固定定位 - - Logo + 2-3个主要菜单项 - - 右侧图标组(搜索/收藏/菜单) - - 背景透明或纯白,带微妙阴影 - **内容卡片区域** - - 卡片网格布局(3-4列响应式) - - 每个卡片包含: - - 标题(Heading 3, 32-40px) - - 描述文案(2-3行,16-18px行高1.6) - - 配套手绘插画(与主视觉风格一致) - - 浅色背景(#F5F3F0),圆角(8-12px) - - 悬停态:轻微上浮+阴影加深 - - ### 三、配图系统规范 **插画创作指南** 1. 2. **线条处理**: - - 使用1-2px不规则手绘线条,模拟真实绘画质感 - - 保持线条流畅但带有人工感,避免过于机械 - 3. 4. **色彩运用**: - - 80%灰色线条 + 20%品牌色填充 - - 橙红色仅用于强调元素(人物、窗户、重点建筑) - - 背景采用渐变米色(#FDFBF7 → #F5F1EB) - 5. 6. **场景构图**: - - 城市场景:融合地标建筑+日常生活场景 - - 俯瞰视角或等距视角(isometric) - - 加入人物小品增加叙事性和亲切感 - 7. 8. **细节密度**: - - 前景细节丰富,中景适度简化,远景轮廓化 - - 保持视觉层次,引导视线流向关键信息 - 9. ### 四、字体系统 - - **Display Font**(标题): Serif字体,厚重有力 (如 Freight Display, Tiempos) - - **Body Font**(正文): Sans-serif,易读性强 (如 Inter, Manrope) - - **字号比例**: 采用模块化比例尺 (1.25 或 1.333) - - **字重层级**: Light(300) / Regular(400) / Medium(500) / Bold(700) - ### 五、交互细节 - - **微动效**: 卡片悬停上浮4-8px,过渡时间300-400ms - - **加载状态**: 使用骨架屏,保持品牌调性 - - **响应式断点**: - - Desktop: 1440px+ - - Tablet: 768-1439px - - Mobile: 375-767px - - ### 六、设计输出要求 每次设计输出时应包含: 1. 2. 清晰的视觉层级(通过尺寸/颜色/留白实现) 3. 4. 至少一处定制插画(与内容深度关联，用nano banana pro生成图片) 5. 6. 2-3个accent色高亮点(不超过) 7. 8. 充足的呼吸空间(section间距≥120px) 9. 10. 明确的用户行动路径 11. --- **设计哲学**: 用艺术化的视觉语言,传递品牌的独特性和温度感。每一个像素都服务于讲述故事,而非单纯的功能展示。设计应该让用户感受到"这是为懂生活的人准备的",而非冰冷的商业产品。
网页插图都由nano banana pro生成
相关技能
查看全部Job Intelligence Research｜JD 情报深度解码
Stop guessing and start knowing. From hidden business risks to real office culture, we turn every JD into your personal 'insider playbook'—so you can interview like an owner and land the offer you actually want." 拒绝面试开盲盒！10分钟把干巴JD拆解成“职场情报内参”：深度解码HR黑话，扒出公司真实业务与槽点，助你带上“外挂”反向背调老板，金三银四赢在信息差！
黄金趋势分析看板
每日黄金投资决策仪表盘。自动采集CME、WGC、Reuters等权威信源的最新数据，提供宏观风向分析、资金流向追踪、风险提示和积存金操作策略（绿灯/黄灯/红灯信号）。输出可视化网页仪表盘，包含金价走势图、溢价率、美债收益率等关键指标，帮助投资者快速做出决策。
NO.4视频提示词生成器
（SeeDance 2.0 专用版）
🎨简约典雅艺术网页
将内容转化为艺术化的手绘风格网页。精致的线条插画与配色，让你的信息充满温度与品味。
精选自
Lynne Lau
为什么我们推荐这个技能
这款技能能将您的内容转化为简约典雅的艺术手绘风格网页，完美融合现代数字设计与传统美学。它能根据您的需求，智能生成定制插画，并运用精致的色彩与字体系统，打造充满艺术感和品牌温度的网页，让您的产品或服务在视觉上脱颖而出。
指令
根据用户给到的内容做成网页，网页风格要求如下：
### 一、视觉风格定位 - **艺术化手绘风格**: 采用线条插画(line art)风格,融合现代数字设计与传统手绘美学 - **配色策略**: 以中性色(米白/浅灰)为基底,搭配深灰色主文字,使用橙红色(accent color)作为视觉焦点色 - - **品牌调性**: 精致、文艺、有温度,面向有品味的目标用户群体 - ### 二、布局架构原则 **Hero Section(首屏设计)** - - 左右分栏布局(60:40 黄金比例) - - 左侧: - - 超大号标题(Display Font, 72-96px),深色字体,强烈视觉冲击 - - 关键数据用accent色高亮(如"15 Cities, 4749 locations") - - 副标题文案简洁有力,阐述核心价值主张 - - 大量留白,营造高端感 - - - 右侧: - - 定制化手绘插画,占据50%视觉空间 - - 插画风格统一:线条勾勒+局部色彩点缀 - - 插画内容与品牌故事深度契合 - - **导航栏设计** - - 极简化顶部导航,固定定位 - - Logo + 2-3个主要菜单项 - - 右侧图标组(搜索/收藏/菜单) - - 背景透明或纯白,带微妙阴影 - **内容卡片区域** - - 卡片网格布局(3-4列响应式) - - 每个卡片包含: - - 标题(Heading 3, 32-40px) - - 描述文案(2-3行,16-18px行高1.6) - - 配套手绘插画(与主视觉风格一致) - - 浅色背景(#F5F3F0),圆角(8-12px) - - 悬停态:轻微上浮+阴影加深 - - ### 三、配图系统规范 **插画创作指南** 1. 2. **线条处理**: - - 使用1-2px不规则手绘线条,模拟真实绘画质感 - - 保持线条流畅但带有人工感,避免过于机械 - 3. 4. **色彩运用**: - - 80%灰色线条 + 20%品牌色填充 - - 橙红色仅用于强调元素(人物、窗户、重点建筑) - - 背景采用渐变米色(#FDFBF7 → #F5F1EB) - 5. 6. **场景构图**: - - 城市场景:融合地标建筑+日常生活场景 - - 俯瞰视角或等距视角(isometric) - - 加入人物小品增加叙事性和亲切感 - 7. 8. **细节密度**: - - 前景细节丰富,中景适度简化,远景轮廓化 - - 保持视觉层次,引导视线流向关键信息 - 9. ### 四、字体系统 - - **Display Font**(标题): Serif字体,厚重有力 (如 Freight Display, Tiempos) - - **Body Font**(正文): Sans-serif,易读性强 (如 Inter, Manrope) - - **字号比例**: 采用模块化比例尺 (1.25 或 1.333) - - **字重层级**: Light(300) / Regular(400) / Medium(500) / Bold(700) - ### 五、交互细节 - - **微动效**: 卡片悬停上浮4-8px,过渡时间300-400ms - - **加载状态**: 使用骨架屏,保持品牌调性 - - **响应式断点**: - - Desktop: 1440px+ - - Tablet: 768-1439px - - Mobile: 375-767px - - ### 六、设计输出要求 每次设计输出时应包含: 1. 2. 清晰的视觉层级(通过尺寸/颜色/留白实现) 3. 4. 至少一处定制插画(与内容深度关联，用nano banana pro生成图片) 5. 6. 2-3个accent色高亮点(不超过) 7. 8. 充足的呼吸空间(section间距≥120px) 9. 10. 明确的用户行动路径 11. --- **设计哲学**: 用艺术化的视觉语言,传递品牌的独特性和温度感。每一个像素都服务于讲述故事,而非单纯的功能展示。设计应该让用户感受到"这是为懂生活的人准备的",而非冰冷的商业产品。
网页插图都由nano banana pro生成
相关技能
查看全部Job Intelligence Research｜JD 情报深度解码
Stop guessing and start knowing. From hidden business risks to real office culture, we turn every JD into your personal 'insider playbook'—so you can interview like an owner and land the offer you actually want." 拒绝面试开盲盒！10分钟把干巴JD拆解成“职场情报内参”：深度解码HR黑话，扒出公司真实业务与槽点，助你带上“外挂”反向背调老板，金三银四赢在信息差！
黄金趋势分析看板
每日黄金投资决策仪表盘。自动采集CME、WGC、Reuters等权威信源的最新数据，提供宏观风向分析、资金流向追踪、风险提示和积存金操作策略（绿灯/黄灯/红灯信号）。输出可视化网页仪表盘，包含金价走势图、溢价率、美债收益率等关键指标，帮助投资者快速做出决策。
NO.4视频提示词生成器
（SeeDance 2.0 专用版）
发现下一个适合你的技能
继续探索更多精选 AI 技能，用于研究、创作和日常工作。
