AI Agent Skills

Design, implement, or review websites and application interfaces through product-specific visual direction, information architecture, interaction design, responsive beha…

Use when Codex is building, revising, or reviewing a frontend UI, web app screen, responsive layout, component surface, dashboard view, form flow, visual system, or no-t…

前端工程师 Skill，执行前端开发任务，自动适配项目技术栈（React/Vue/Svelte/Next.js 等），支持 Figma/Stitch 设计稿还原

微信小程序开发工程师 Skill，执行小程序开发任务，自动适配项目技术栈（原生小程序/Taro/uni-app 等），支持 Figma/Stitch 设计稿还原与云开发

Load when a task needs anti-template frontend visual direction, design-read calibration, or pre-flight critique for landing pages, portfolios, marketing pages, or redesi…

Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI. Provides project context, component docs, and usage examples. A…

二级市场投研 PPT 生成 skill。把已有的研究输出（sm-company-deepdive / sm-thesis / sm-red-team / sm-earnings-preview 等）转成**机构级投研路演 PPT**，带完整 UI 设计系统、10 段标准结构、证据可追溯标注。适合 IC 会议、路演、PM 汇报、客户展示。…

Convert natural-language UI requests into A2UI v0.9 JSON protocol messages that an A2UI renderer can consume.

Generate valid OpenUI Lang v0.5 functional-notation programs for the Lynx OpenUI renderer. Use when Codex must turn a natural-language UI request into raw OpenUI DSL for…

从网页、截图或任意视觉设计中逆向解析出完整、可复用的设计风格定义，按「Token → 映射 → 组件 → 约束」四层逻辑输出结构化的设计风格 Markdown 文档。当用户需要提取某个网站/设计稿的视觉风格、复刻某站点的 UI 风格（如"做成 OpenAI 主页那样"）、建立设计系统、或把一份设计逆向成可复用规范时使用。

For users creating a two-player co-op game menu or opening animation. Users provide two player names, a game title, a target visual style, and optional character referen…

Guide for implementing web accessibility (WCAG). Use when designing UI components, reviewing interfaces for accessibility, or ensuring compliance with W3C WAI standards.

Rebuild an Apple-style Mac launch film entirely in code with Claude Code. A thin menu bar, the black notch growing into widgets one scene at a time, full-screen gradient…

The setup step every other skill in this pack reads. A short interview plus 3 to 5 reference frames becomes two files in your project, brand.md (who you are, what you se…

Build any of 16 premium motion effects from scratch in your own brand, as one 8-second looping HTML file with window.seek(seconds) so it exports frame-exact to MP4 or GI…

Evaluate Figma designs from operator persona perspectives through design critique and user experience evaluation. Use when reviewing UX for specific user roles (e.g., ai…