메뉴
BenZenith 品牌专用前端设计与UI实现规范。用于生成或优化 BenZenith 官网/落地页/活动页/电商页面/组件（React/Next.js/HTML/CSS/Tailwind 等），或根据设计稿/截图进行高还原实现；要求输出可直接落地的 production-grade 代码与清晰的设计决策，并强制遵循 BenZenith 的品牌调性（东方极简、珠宝级质感、水/墨肌理、黑金与温润中性色体系），避免通用模板化“AI slop”界面。
기본적으로 소스를 먼저 확인하는 Prompt가 선택됩니다. 직접 명령으로 전환하거나 로컬 사본을 다운로드할 수도 있습니다.
설치 여부를 결정하기 전에 SKILL.md와 SkillsMP에 표시된 보조 파일을 읽어 보세요.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
직접 명령은 검토 Prompt를 거치지 않습니다. 실행하기 전에 소스를 확인하세요.
npx skills add https://github.com/Rabbit-Ivan/Ivan-skills --skill benzenith-frontend-design명령은 한 줄로 유지됩니다. 복사하기 전에 가로로 스크롤해 전체 내용을 확인하세요.
로컬 사본을 원하시나요? SkillsMP에서 현재 제공할 수 있는 파일을 다운로드하세요.
Ivan Skills 仓库级入口说明与维护规范
Produces a severity-rated (高/中/低) Clean Code findings report across 7 dimensions (naming, function size/SRP, duplication/DRY, over-engineering/YAGNI, magic numbers, structural clarity, project conventions), each with a location and a behavior-preserving refactor suggestion — never changing functionality. Use whenever the user asks for a code review, quality check, refactor advice, or code-smell / Clean Code analysis, OR points at a file/function/diff and asks if it is well-written, too long, too repetitive, over-engineered, or poorly named — even casually, and even if they never say "review" ("I just wrote this, look it over", "does this look good before I commit"). Trigger on 代码体检, 代码质量, 重构检查, 代码审查, 这段代码写得怎么样, 帮我看看代码有没有问题, 有没有坏味道, 这函数是不是太长了, 命名规范吗, 魔法数字, 重复代码, 过度设计, and English like "is this code clean", "any code smells", "check this file".
Generate a magazine-quality visual card as a single self-contained HTML file (embedded CSS, Swiss-grid + bold-type design system), then screenshot it to a shareable PNG and hand back both files. Use this whenever the user wants content turned into a visually rich card or shareable image — even if they don't say the word "card." Triggers: make/create/generate/design a visual card, info card, knowledge card, quote card, social card, summary/takeaway/cheatsheet card; 信息卡, 知识卡片, 金句卡, 语录卡, 做张卡片, 设计一张卡片, 把这段内容做成卡片, 把要点排成一张图, 总结成一张图, 小红书封面, 公众号封面图, 朋友圈配图. Prefer this over generic HTML/frontend skills when the goal is one decorative card image. When the content is a multi-section report instead of a single card, use hai-visual-report.
SOC 직업 분류 기준
SKILL.md 표시 중
| name | benzenith-frontend-design |
| description | BenZenith 品牌专用前端设计与UI实现规范。用于生成或优化 BenZenith 官网/落地页/活动页/电商页面/组件（React/Next.js/HTML/CSS/Tailwind 等），或根据设计稿/截图进行高还原实现；要求输出可直接落地的 production-grade 代码与清晰的设计决策，并强制遵循 BenZenith 的品牌调性（东方极简、珠宝级质感、水/墨肌理、黑金与温润中性色体系），避免通用模板化“AI slop”界面。 |
references/brand-tokens.md before做任何视觉决策。references/ui-recipes.md。brand-tokens.md（必要时可在 token 范围内做深浅阶）。