相关职业SOC
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/CleanExpo/Unite-Group --skill visual-excellence-enforcer命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
基于 SOC 职业分类
正在显示 SKILL.md
| id | visual-excellence-enforcer |
| name | visual-excellence-enforcer |
| type | Encoded Preference Workflow |
| version | 1.0.0 |
| created | 20/03/2026 |
| modified | 20/03/2026 |
| status | active |
| triggers | ["check the UI","review the design","is the visual quality acceptable","audit visual","does it look good","visual review","design review","UI audit","check the frontend"] |
| description | > |
Purpose: The system does not accept generic LLM UI as complete. Every UI component must meet the Scientific Luxury standard before shipping. Proof required: screenshot, not description.
Use this skill when:
This repository uses the Scientific Luxury design system. Reference: docs/DESIGN_SYSTEM.md.
| Rule | Required | Banned |
|---|---|---|
| Background | OLED Black #050505 | Grey, white, any other |
| Border radius | rounded-sm only | rounded-lg, rounded-full, rounded-xl, rounded-2xl, rounded-3xl |
| Animations | Framer Motion only | CSS transition: all linear, animation: without Framer |
| Typography (code/data) | JetBrains Mono | Any other monospace |
| Typography (names/headings) | Editorial New | System fonts |
| Borders | border-[0.5px] border-white/[0.06] | Solid 1px coloured borders |
| Colours | Spectral palette (Cyan #00F5FF, Emerald #00FF88, Amber #FFB800, Red #FF4444, Magenta #FF00FF) | Bootstrap blues, Material greens |
| Shadows | None or subtle glow effects | box-shadow: 0 4px 6px rgba(0,0,0,0.1) (generic) |
Only these easing functions are approved for animations:
--ease-spring: cubic-bezier(, -, , );
: (, , , );
: (, , , );
: (, , , );
These patterns indicate factory-default LLM UI and are rejected immediately:
bg-blue-500)bg-white, bg-gray-50, bg-gray-100)<button> without hover state or animationIf no screenshot has been provided:
VISUAL REVIEW REQUIRED
A screenshot of the actual rendered component/page is required.
Description of UI is not accepted as visual proof.
Please provide: [screenshot path or image]
For each design rule, check the screenshot:
#050505?Search the component file for:
rounded-lg, rounded-full, rounded-xl — FAILbg-white, bg-gray-, bg-slate- — FAIL (unless intentional contrast element)transition-all linear or transition: all 0.3s — FAILanimate- Tailwind animation classes — FAIL (use Framer Motion)VISUAL AUDIT REPORT
═══════════════════════════════════════════════════
Component: [component name / page]
Date: [DD/MM/YYYY]
SCREENSHOT REVIEW
─────────────────
[Screenshot: PROVIDED / NOT PROVIDED]
DESIGN RULE CHECKS
─────────────────
PASS | Background: OLED Black #050505 confirmed
FAIL | Border radius: rounded-lg found on line 23 — replace with rounded-sm
PASS | Typography: JetBrains Mono visible
FAIL | Banned pattern: bg-white on card component — replace with bg-[#050505]
PASS | No placeholder text
PASS | Framer Motion used for animations
SCORE: [N]/[total] rules passing
STATUS: APPROVED | REJECTED
[If rejected: list exact fixes required]
═══════════════════════════════════════════════════
Before approving a UI component:
#050505rounded-lg, rounded-full, or larger| Failure | Recovery |
|---|---|
| Screenshot not provided | Block until screenshot is provided |
| Screenshot is localhost, need production | Request production URL screenshot |
rounded-lg found | Replace with rounded-sm across component |
bg-white found | Replace with bg-[#050505] or correct design token |
| Generic animation | Replace with Framer Motion + approved easing |
| Generic button styling | Apply spectral colour palette + hover state |
Component screenshot shows: dark OLED background, sharp corners, cyan accent on active state, JetBrains Mono for API responses, smooth spring animation on hover. — APPROVED
Component screenshot shows: white card on light grey background, blue primary button, rounded-2xl corners, no animation. — REJECTED — 4 critical violations found.
The authoritative environment-variable registry for the Unite-Group Nexus. Use whenever adding, reading, renaming, or debugging an env var or secret — new integration config, a `process.env.X` read, an auth/OAuth wiring, a cron secret, a "which variable holds this" question, or a "works locally but not in prod" symptom. Also use before pinning any variable name in code, and when reconciling the two credential planes (Vercel prod vs the local hermes fleet). Prevents the `APIFY_API_KEY` vs `APIFY_API_TOKEN` class of drift.
Create, verify, and promote Supabase schema changes via database branches. Every schema change/migration must be validated on a Supabase database branch before prod (see CLAUDE.md line 44).
Verify production Supabase schema before shipping code that touches it. Use BEFORE writing or reviewing ANY code that reads or writes a Supabase table in the Nexus — new queries, inserts, updates, CHECK-constrained values, RLS-dependent reads, cron data access — even one-line changes and even when the table "obviously" exists. Also use immediately when a query fails with "column does not exist", when inserts appear to succeed but produce no rows, or when generated TypeScript types disagree with runtime behaviour.