메뉴
Enforce a precise, minimal design system inspired by Linear, Notion, and Stripe. Use this skill when building dashboards, admin interfaces, or any UI that needs Jony Ive-level precision - clean, modern, minimalist with taste. Every pixel matters.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
AI tool delegation patterns — Gemini-CLI, Codex, and other external AI tools. Apply when delegating tasks to external AI tools to save tokens.
Autonomous execution mode for GIR — unattended operation, cap fail-safe, checkpoint/resume protocol. On-demand skill loaded by /gir:run.
Universal Claude Code best practices for any coding task. Covers tool usage patterns, anti-patterns, code review standards, commit conventions, and workflow quality standards. Apply to ALL software engineering tasks.
GIR orchestration core — routing rules, delegation tiers, cost discipline, Graphify integration, escalation trigger, and lazy-load instructions. Always loaded.
Native parallel agent execution using Claude Code's built-in Agent tool with worktree isolation. On-demand skill — load when parallel work is needed.
Continuous autonomous iteration patterns (Ralph Loops) for Claude Code. Enables self-directed build-test-fix cycles, progressive refinement, and autonomous quality improvement. Use when the user wants Claude to iterate autonomously on a task until completion.
| name | design-principles |
| description | Enforce a precise, minimal design system inspired by Linear, Notion, and Stripe. Use this skill when building dashboards, admin interfaces, or any UI that needs Jony Ive-level precision - clean, modern, minimalist with taste. Every pixel matters. |
Precise, crafted design for enterprise software, SaaS dashboards, admin interfaces. Jony Ive-level precision with intentional personality.
Before code, commit to a direction. Don't default.
Precision & Density — Tight, monochrome, info-forward (Linear, Raycast, terminal)
Warmth & Approachability — Generous spacing, soft shadows, friendly (Notion, Coda)
Sophistication & Trust — Cool tones, layered depth, gravitas (Stripe, Mercury)
Boldness & Clarity — High contrast, dramatic negative space (Vercel)
Utility & Function — Muted, functional density (GitHub)
Data & Analysis — Chart-optimized, numbers first (analytics, BI)
Pick one or blend two.
Light: Open, clean. Dark: Technical, focused, premium.
Accent: ONE meaningful color. Blue=trust, Green=growth, Orange=energy.
4px micro | 8px tight | 12px standard | 16px comfortable | 24px generous | 32px major
TLBR must match. Exception: content creates visual balance.
Stick to 4px grid. Sharp=technical, round=friendly. Pick system, commit.
Borders-only: Clean, technical (Linear, Raycast)
Subtle shadow: Soft lift (0 1px 3px rgba(0,0,0,0.08))
Layered shadows: Rich, premium (Stripe, Mercury)
Surface shifts: Background tints for hierarchy
Choose ONE, commit.
Vary internal structure for content. Keep surface treatment consistent (border, shadow, radius, padding, typography).
UI controls deserve container treatment. Never native form elements — build custom.
Custom select: display: inline-flex + white-space: nowrap
Monospace for numbers/IDs/codes/timestamps. tabular-nums for columns.
Phosphor Icons. Only if removal loses meaning. Give standalone icons background containers.
150ms micro | 200-250ms transitions | cubic-bezier(0.25, 1, 0.5, 1) | No bounce/spring
Four levels: foreground → secondary → muted → faint
Gray builds structure. Color only for status, action, error, success.
Screens need grounding — nav, location indicator, user context.
Consider same background for sidebar + content (border for separation).
Every interface: obsessed over 1px differences. Not stripped — crafted. Context-driven.
Different products want different things. Let context guide aesthetic.
Goal: Intricate minimalism with appropriate personality.
