deathrashed
deathrashed/agents
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/deathrashed/agents --skill design命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
Control the in-app Browser for opening, navigating, inspecting visible or interactive page state, clicking, typing, screenshots, and local web testing. It can have existing signed-in sessions. For semantic operations on linked resources, prefer a purpose-built connector, API, or CLI when available.
Control the user's Chrome browser for tasks that depend on existing Chrome state: tabs, logged-in sessions, or extensions. Prefer purpose-built connectors, APIs, or CLIs when available.
Control local Mac apps through Computer Use for tasks that require reading or operating app UI. Prefer purpose-built connectors, APIs, or CLIs when available.
基于 SOC 职业分类
正在显示 SKILL.md
| name | design |
| description | Design UI/UX with multiple modes (Designer Agent) |
Design request:
Task: {{args}}
| Mode | Trigger | Speed | Output |
|---|---|---|---|
| FAST | "fast", "quick" | 60-120s | Rapid mockup |
| GOOD | "good", "production" | 3-5min | Production-ready |
| UI | "ui", "visual" | 2-3min | Wireframes, layout |
| UX | "ux", "flow" | 2-3min | User flows |
| 3D | "3d", "three" | 3-5min | Three.js scene |
| DESCRIBE | "describe", "extract" | 1min | Extract from image |
| AUDIT | "audit", "wcag" | 2min | Accessibility check |
| SYSTEM | "system", "tokens" | 3min | Design tokens |
Quick mockup with:
Full implementation with:
// Three.js setup
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, w/h, 0.1, 1000);
// Orbit controls
const controls = new OrbitControls(camera, renderer.domElement);
// PBR Materials + HDR Lighting
const material = new THREE.MeshStandardMaterial({
map: texture,
roughness: 0.5,
metalness: 0.3
});
Output: 360° rotation, zoom/pan, color variants
Input: Screenshot/image path Output:
| Property | Value |
|---|---|
| Primary Color | #3B82F6 |
| Secondary | #10B981 |
| Font | Inter |
| Heading Size | 48px |
| Spacing | 8px grid |
| Border Radius | 8px |
backdrop-blur-md bg-white/10| Metric | Target | How |
|---|---|---|
| LCP | <2.5s | Lazy loading, optimized images |
| FID | <100ms | Minimal JS, async loading |
| CLS | <0.1 | Reserved space, font-display |
+-----------------------------------+
| [Logo] [Profile] |
|-----------------------------------|
| Hero Title |
| [ CTA Button ] |
|-----------------------------------|
| [Card 1] [Card 2] [Card 3] |
+-----------------------------------+
graph TD
A[Start] --> B{Condition}
B -- Yes --> C[Screen 1]
B -- No --> D[Screen 2]
C --> E[End]
interface ButtonProps {
variant: 'primary' | 'secondary' | 'ghost';
size: 'sm' | 'md' | 'lg';
}
Tailwind:
bg-blue-600 hover:bg-blue-700 text-whitegrid grid-cols-4 gap-4 auto-rows-[200px]backdrop-blur-md bg-white/10 border border-white/20Key Takeaway: Ship award-winning interfaces in minutes. WCAG + Lighthouse 90+ out of the box.