OPPO 设计风格——精致优雅与自然美学

SKILL前端设计
前端设计 未标注权限 许可证不明确
安装这个技能

OPPO 官网设计风格指南——配色(品牌绿+自然色+#1A1A1A 旗舰黑)、 排版(ColorOS 无衬线+精致留白)、布局(克制+呼吸感)、 影像(哈苏合作+色彩科学)、文案(诗意+人文)。 v1.1 新增页面生成器:输入产品名/Slogan → 一键生成 OPPO 风格 HTML(品牌绿+自然米白+圆角按钮+克制留白)。 当用户提到「OPPO 风格」「哈苏设计」「自然美学」时触发。

一句话选型结论

按资料字段整理

OPPO 设计风格——精致优雅与自然美学是前端设计类的 Agent Skill,安装方式未标注,权限级别未标注,许可证不明确,有可直接复制的安装命令。技能本质是给模型读的说明书,效果取决于模型与客户端;装完先用一个小任务验证,再放进正式流程。

分类前端设计 安装方式未标注 权限级别未标注权限 许可证许可证不明确
累计安装 未标注 本周 未标注
GitHub 星标 未标注 仓库 未标注
下载量 未标注 技能市场下载数
权限级别 未标注权限 安装前请确认风险范围
许可证 许可证不明确 未说明

安装

未标注
在支持 Skills 的客户端里执行,装完问一句「你有哪些技能」验证
skillhub install user_2af611f4/oppo-design-style
  1. 1
    确认客户端支持

    确认你的客户端支持 Skills(Claude、Codex、Cursor 等),并升级到较新的版本。

  2. 2
    拿到技能文件

    执行上面的命令安装;也可以把仓库里的 SKILL.md 手动放进客户端的 skills 目录。

  3. 3
    刷新技能列表

    重新打开客户端,或刷新技能列表,让新放进来的技能被加载。

  4. 4
    验证是否生效

    问一句「你有哪些技能」,确认列表里出现它,再拿一个小任务试跑。

技能档案

前端设计
字段来自技能仓库与公开索引,中文说明由本站标注
作者 / 维护方user_2af611f4仓库 未标注 · 版本 未标注
宿主客户端未标注技能可被这些客户端加载
安装方式未标注安装包 community
权限级别未标注权限安装前请确认风险范围
许可证未说明许可证不明确,商用前请自行确认条款
仓库可用性available技能仓库当前是否可访问
最近核验未标注上游最后核验时间 · 数据更新 1791625048
正文体量2.5 KBSKILL.md 原文大小,越大说明说明书写得越细

典型使用场景

3 类
按分类整理的常见用法,具体以 SKILL.md 为准
出页面与组件

按描述生成页面结构和组件草稿。

调整样式与布局

改间距、配色与响应式布局。

生成设计说明

把设计稿整理成开发能接的说明。

选择建议

装之前先看这几条
按条目字段给出的判断,不替你决定用不用

值得选的地方

  • 有可直接复制的安装命令,不用自己翻文档找入口。

先想清楚的地方

  • 没有标注权限级别,实际能做什么要装好后确认。
  • 许可证不明确,商用或二次分发前先到仓库确认条款。
  • 没有做站内核验,内容以作者仓库为准。
  • 技能只是说明书,实际效果取决于模型与客户端,装完先用小任务试一遍。

更适合

  • 需要在前端设计场景里给模型补一套做法的人。
  • 愿意先读一遍 SKILL.md、确认它会让模型做什么的人。

不太适合

  • 对许可证要求很严、必须明确可商用的人。
  • 只想装完就自动变强、不打算看说明书的人。

同类对比

6 个同类
同分类里挑最接近的几条,字段以各自详情页为准
技能权限级别安装方式累计安装宿主客户端安装命令
OPPO 设计风格——精致优雅与自然美学当前 未标注权限 未标注 未标注 未标注 有
前端设计 只读 GitHub 仓库 882.3 万 Codex、Claude、Cursor 有
Vercel 组合模式 联网访问 GitHub 仓库 385.9 万 Codex、Claude、Cursor 有
Vercel React native skills 前端 只读 GitHub 仓库 246.9 万 Codex、Claude、Cursor 有
adapt 搜索 浏览器控制 GitHub 仓库 202.7 万 Codex、Claude、Cursor 有
使用我的浏览器 浏览器控制 GitHub 仓库 184.8 万 Codex、Claude、Cursor 有

SKILL.md 全文

2.5 KB
模型实际读到的说明书原文,来自技能仓库

OPPO 设计风格指南

> 「致善式创新。」—— OPPO 创始人 陈明永

🆕 v1.1 页面生成器

# 输入产品名/Slogan → 生成 OPPO 风格 HTML
python3 scripts/oppo_page_generator.py --product "Find N3" --slogan "折叠新标杆" --accent "#1EA366"

# 交互模式
python3 scripts/oppo_page_generator.py -i

# 看示例
python3 scripts/oppo_page_generator.py --example

特性:品牌绿 CTA + 自然米白背景(#F5F0E8)+ 圆角胶囊按钮 + 克制留白 + 数据卡片 + 样张网格。


配色

角色 色值 用途
品牌绿 #1EA366 Logo、CTA
旗舰黑 #1A1A1A Find 系列 Hero
自然色 #F5F0E8(米白)、#E8D5C4(奶咖) 背景色系统
哈苏橙 #E56E26 哈苏合作标识

> 关键差异:OPPO 的绿比小米的橙更"安静"。整体色调偏自然、温柔。

排版

层级 字体 特征
Hero OPPO Sans / 系统 Bold, 36-48px 留白极大
产品名 24-32px, Bold —
正文 15-17px, Regular, 浅灰 1.8 行距——Apple 级别的呼吸感

布局

  1. 极致克制——一个屏幕最多 2 个信息块
  2. 产品为中心——大量留白环绕产品图
  3. 自然色彩过渡——暖米色+奶咖色分区

影像

规则
样张:哈苏色彩科学,自然、不饱和
产品图:暖光+微距+反射纹理
人物:自然光、表情松弛、不摆拍

文案

原则 示例
诗意 「点亮暗光」「留住心跳」
人文 「用影像讲述每一个故事」
克制 Find 系列一句话:「Find N3,折叠新标杆」

风格关键词: 绿色、自然色、哈苏、克制留白、诗意文案

常见问题

5 问
答案由本站依据条目字段整理
OPPO 设计风格——精致优雅与自然美学怎么安装?

在支持 Skills 的客户端里执行:skillhub install user_2af611f4/oppo-design-style。安装方式为未标注。装完刷新技能列表或重开客户端。

OPPO 设计风格——精致优雅与自然美学支持哪些客户端?

资料没有标注宿主客户端,但只要客户端支持 Skills(Claude、Codex、Cursor 等),一般都能加载。

OPPO 设计风格——精致优雅与自然美学权限高吗,安全吗?

权限级别为未标注权限。安装前先看它会读取或写入哪些内容。

OPPO 设计风格——精致优雅与自然美学收费吗?

本站不代收费用,也没有标注具体价格。是否收费取决于技能本身和所用的模型或客户端,正式使用前按作者说明确认。

OPPO 设计风格——精致优雅与自然美学用什么许可证?

许可证标注为 未说明(许可证不明确)。商用或二次分发前请到仓库确认条款原文。

热门专题

按场景挑技能
全部专题 →

技能内容以作者仓库为准;分类、权限级别与许可证状态的中文说明为中文整理,最近核验 未标注。