菜单
SkillsMP 已收集 Jason904/ui-skill-lab 中的 14 个 Skill。打开任一 Skill 可查看来源和详情。
已展示 14 / 14 个已收集 Skill。
This skill should be used after visual-spec-review passes and before OpenSpec UI update or frontend implementation. It expands screenshot-derived visual specs into a production design system by adding interaction states, responsive behavior, accessibility…
原文语言：英语
This skill should be used when the user asks to convert a PRD, OpenSpec change, or product idea into a structured GPT Image 2 UI prompt pack for generating high-fidelity flat UI reference images. It produces prompt materials, UI type decisions, variants,…
原文语言：英语
This skill should be used after Codex implements a UI change and before visual acceptance review. It audits source code against project-specific visual specs, design tokens, component tree, design-system rules, OpenSpec implementation strategy, UI type,…
原文语言：英语
Use for UI/UX design intelligence in Codex: planning, building, reviewing, improving, or implementing web/mobile interfaces, landing pages, dashboards, design systems, components, accessibility, color palettes, typography, spacing, motion, charts, responsive…
原文语言：英语
This skill should be used after spec-compliance-review and before visual-diff-fix. It captures or analyzes actual browser screenshots and compares them against the reference design, responsive spec, visual tokens, layout spec, component tree, UI type, layout…
原文语言：英语
This skill should be used after visual-acceptance-review has generated fix-tasks.json. It applies precise visual fixes from structured diff tasks, preserves source-of-truth contracts, avoids redesign and unrelated refactors, validates each batch, and outputs…
原文语言：英语
This skill should be used after visual-to-spec has produced 03_visual_spec/ and before design-system-governor or frontend implementation begins. It independently reviews extracted visual specs against the reference screenshot, UI type, layout paradigm,…
原文语言：英语
Use when a user provides a reference UI screenshot and asks to extract visual specs, generate design tokens, create a component tree, or produce a frontend implementation contract, including dashboards, landing pages, mobile screens, image-led UIs, panorama…
原文语言：英语
Design banners for social media, ads, website heroes, creative assets, and print. Multiple art direction options with AI-generated visuals. Actions: design, create, generate banner. Platforms: Facebook, Twitter/X, LinkedIn, YouTube, Instagram, Google Display,…
原文语言：英语
Brand voice, visual identity, messaging frameworks, asset management, brand consistency. Activate for branded content, tone of voice, marketing assets, brand compliance, style guides.
原文语言：英语
Comprehensive design skill: brand identity, design tokens, UI styling, logo generation (55 styles, Gemini AI), corporate identity program (50 deliverables, CIP mockups), HTML presentations (Chart.js), banner design (22 styles, social/ads/web/print), icon…
原文语言：英语
Token architecture, component specifications, and slide generation. Three-layer tokens (primitive→semantic→component), CSS variables, spacing/typography scales, component specs, strategic slide creation. Use for design tokens, systematic design,…
原文语言：英语
Create strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies.
原文语言：英语
Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs. Use when building user interfaces, implementing design systems, creating responsive…
原文语言：英语