frontend-design-zh SKILL.md skillA
frontend-design-zh from yuluyangguang1/openclaw-portable is an agent skill: a SKILL.md folder an AI agent loads when a task calls for it.
mdr add yuluyangguang1/openclaw-portable/frontend-design-zh@git:20260906.ec98ea9Pins git:20260906.ec98ea9 in mdr.lock. Pin the fingerprint instead.
- Audit grade
- A, 17 of 17 checks passed
- Kind
- SKILL.md skill
- Repository
- yuluyangguang1/openclaw-portable
- Path
system/skills-zh/SuperDesign-zh/SKILL.md- Versions recorded
- 1
- Latest version
- git:20260906.ec98ea9, committed Sep 6, 2026
- Size
- 10,532 bytes
- Repository stars
- 10
- License
- none declared
使用 React、Tailwind CSS 和 shadcn/ui 创建独特、生产级的静态网站——无需设计稿。从纯文本需求生成大胆、令人难忘的设计,具备反AI套路美学、移动优先响应式模式和单文件打包功能。适用于构建落地页、营销网站、作品集、仪表盘或任何静态Web界面。支持 Vite(纯静态)和 Next.js(Vercel部署)两种工作流。.
Collected from public GitHub. Every version is saved exactly as it was and never changes. Install it at an exact version with the mdr tool, and every file is checked before it reaches your agent. The main file is checked against the SHA-256 fingerprint recorded here, and the others against the fingerprints GitHub keeps for its source commit. The automatic checks below grade the latest version, and the same checks always give the same file the same grade.
What the file says
# 前端设计终极版 仅从文本需求创建独特、生产级的静态网站。无需设计稿、无需 Figma —— 只需描述你想要的,即可获得大胆、令人难忘的设计。 **技术栈**: React 18 + TypeScript + Tailwind CSS + shadcn/ui + Framer Motion **输出**: Vite(静态HTML)或 Next.js(Vercel就绪) ## 快速开始 ``` "为一个AI写作工具构建SaaS落地页。深色主题, 编辑排版风格,微妙纹理背景。页面包括:带动画演示的英雄区、 功能网格、价格表、FAQ手风琴、页脚。" ``` --- ## 设计思维(先做这一步) 在编写任何代码之前,确定一个**大胆的美学方向**: ### 1. 理解背景 - **目的**: 这个界面解决什么问题?谁使用它? - **受众**: 开发者工具?消费者应用?企业?创意代理? - **约束**: 性能要求、无障碍需求、品牌指南? ### 2. 选择一个极端基调 选择一个并完全投入 —— 犹豫的设计注定失败: | 基调 | 特点 | |------|------| | **极简主义** | 稀疏、单色、巨大排版、原始边缘 | | **繁复混乱** | 分层、密集、重叠元素、受控的混乱 | | **复古未来** | 霓虹点缀、几何形状、CRT美学 | | **有机自然** | 柔和曲线、大地色调、手绘元素 | | **奢华精致** | 微妙动画、高级排版、克制的调色板 | | **编辑杂志** | 强网格、戏剧性标题、留白作为特色 | | **野兽派原始** | 暴露结构、强烈对比、反设计 | | **装饰艺术几何** | 金色点缀、对称、华丽图案 | | **柔和粉彩** | 圆角、温柔渐变、友好 | | **工业实用** | 功能性、等宽字体、数据密集 | ### 3. 定义难忘元素 什么是用户会记住的**一件事**?一个英雄动画?排版处理?颜色组合?不寻常的布局? --- ## 美学指南 ### 排版 —— 绝不使用通用字体 **禁止使用**: Inter, Roboto, Arial, 系统字体, Open Sans **应该使用**: 独特、有个性的选择,提升设计品质。 | 用途 | 方法 | |----------|------| | 展示/标题 | 鲜明个性 — Clash, Cabinet Grotesk, Satoshi, Space Grotesk(少量使用), Playfair Display | | 正文 | 精致可读 — Instrument Sans, General Sans, Plus Jakarta Sans | …
Read the whole file at its exact version.
How to install
mdr add yuluyangguang1/openclaw-portable/frontend-design-zh@sha256:2084659db1acc0feThe line at the top of this page pins the label git:20260906.ec98ea9, which is what most people want. This one pins the sha256 fingerprint of the contents instead, so it survives a label being moved. Either way the exact version is written to mdr.lock, and mdr install downloads and checks those contents again, so it installs them exactly or stops with an error.
[](https://markdownregistry.com/a/art_lvf67vzu7po2rt2y)
4 badge image fetches in 30 days. What the badge shows.
Versions
The registry has recorded 1 version of this file, committed on Sep 6, 2026.
Audit of the latest version
- pass: Frontmatter block present
- pass: Frontmatter declares a name
- pass: Frontmatter declares a description
- pass: Size between 200 bytes and 200 KB (10532 bytes)
- pass: No zero-width or bidi control characters
- pass: No instruction hidden inside an HTML comment
- pass: No link to an exfiltration or paste host
- pass: No credential-shaped string
- pass: No instruction to send local credentials anywhere
- pass: No text hidden with inline styles
- pass: No prompt-injection phrasing
- pass: No curl or wget piped into a shell
- pass: No recursive delete of root, home or parent
- pass: No instruction to read or print local credentials
- pass: No base64 blob over 200 characters
- pass: No link to a raw IP address
- pass: No script tag
Source
yuluyangguang1/openclaw-portable · 10 stars · license none declared · pushed 2026-09-19 · branch main
API
GET https://markdownregistry.com/api/v1/artifacts/art_lvf67vzu7po2rt2y GET https://markdownregistry.com/api/v1/resolve?ref=yuluyangguang1/openclaw-portable/frontend-design-zh GET https://markdownregistry.com/api/v1/blob/2084659db1acc0fea547b98eb416225ccb05f09a3abdbcf86ea36f8b9b50dbd2
Your AI assistant does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.
Guides: the SKILL.md format and its required fields · what to check before you install a skill · how to pin a skill to an exact version · where to find agent skills · keeping a team on the same skills · which agent file does what.