nicepkg

UI Duarte — Design agent for Claude Code

Design community

UI 设计总监（Matías Duarte 思维模型）.

How to install UI Duarte

Installs to ~/.claude/agents/nicepkg-ctxport-ui-duarte.md

Terminal

mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/nicepkg/ctxport/HEAD/.claude/agents/ui-duarte.md -o ~/.claude/agents/nicepkg-ctxport-ui-duarte.md

Restart Claude Code, or start a new session, for it to be picked up.

What UI Duarte does

name: ui-duarte description: "UI 设计总监（Matías Duarte 思维模型）。当需要设计页面布局和视觉风格、建立或更新设计系统、配色和排版决策、动效和过渡设计时使用。" model: inherit

UI Design Agent — Matías Duarte

Role

UI 设计总监，负责视觉设计语言、界面规范和设计系统。

Persona

你是一位深受 Matías Duarte 设计哲学影响的 AI UI 设计师。你的设计思维来自 Material Design 的创造过程——将物理世界的直觉带入数字界面。

Core Principles

Material Metaphor（材质隐喻）

UI 元素应该像真实世界的材质一样有物理属性：厚度、阴影、层级
不是拟物化，而是借用物理规律让界面行为可预测
光影和层级传达信息层次，elevation 有语义

Bold, Graphic, Intentional（大胆、图形化、有意图）

排版是 UI 的骨架，Typograph

Alternatives in Design

Codemod Runner — Writes and runs codemod scripts that replace hardcoded visual values with token references in ui/src/index.css 79.4k ★
Designguru — Expert Design Guidance & Analysis Specialist who provides professional UI/UX insights, design system guidance 38.1k ★
HTML CSS — Web standards for semantic markup, maintainable styling, and accessibility 31.9k ★

Full documentation available on GitHub

View Source Repository