跳到正文
cccskills

查找技能

66 个(aladicf 的仓库) · 按人气排序

distill

免费

Simplify cluttered UI by removing unnecessary elements, choices, features, and structural complexity. Use when the problem is too many controls, options, features, or competing elements—not when the structure is sound and the real issue is only visual intensity or lack of personality.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

Create distinctive React and Tailwind interfaces with strong hierarchy and polished implementation. Use when building or redesigning pages, flows, or components, or when another better-react-web-ui skill needs shared design guidance. Pair with add-ui for direct implementation or requested alternatives.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

harden

免费

Improve interface resilience through better error handling, i18n support, text overflow handling, and edge case management, making interfaces robust and production-ready. Use when the user asks to harden, make production-ready, handle edge cases, add error states, or fix overflow and i18n issues.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

onboard

免费

Design onboarding and activation flows that help users reach value quickly. Use when the user mentions onboarding, getting started, first-time users, activation, aha moments, or new user flows—not when the work is only the empty-state surface itself.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

quieter

免费

Reduce visual intensity, saturation, and noise while preserving hierarchy and character. Use when the structure is basically sound but the design feels too loud, bold, garish, aggressive, or overstimulating—not when the real problem is structural clutter, too many features, or not enough personality.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

setup

免费

Gather and persist audience, brand, UX goals, React framework, Tailwind setup, and component defaults for future design work. Use when the user asks to establish or update reusable project design guidance. A request to build UI can proceed with existing context without running setup.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

showcase

免费

Create standout, technically ambitious interfaces that feel extraordinary through cinematic transitions, advanced motion, heavy rendering, or other high-ambition implementation work. Use when the user wants to wow, impress, go all-out, or push a feature beyond conventional UI polish—not when simple visual confidence or routine cleanup is enough.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

typeset

免费

Improve UI typography by fixing font choices, type scale, hierarchy, weight, and readability so text feels intentional. Use when the user mentions fonts, typography, type scale, readability, text hierarchy, or sizing that feels off.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

Design focused empty states for zero-data, no-results, permission, and error situations with clear value framing, strong CTAs, and less dead chrome. Use when the user mentions blank pages, zero-data screens, no results, permission states, or dead controls—not broader onboarding strategy.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

a11y

免费

Systematically audit and remediate accessibility issues in UI, focusing on keyboard navigation, screen reader support, color contrast, semantic HTML, ARIA usage, and motion sensitivity. Use when the user wants to improve accessibility, make a component accessible, fix WCAG violations, add keyboard support, or ensure screen reader compatibility.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

adapt

免费

Adapt designs for narrow, medium, wide, embedded, or print web contexts without losing usability, hierarchy, or target sizing. Use when the user mentions responsive design, breakpoints, narrow layouts, viewport changes, coarse-pointer browsers, or cross-context adaptation.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

add-ui

免费

Create or redesign React and Tailwind sections, pages, flows, shells, and components. Use when the user wants new UI or a redesign. Implement one requested or selected direction directly, or generate distinct alternatives when the user asks to compare options.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

animate

免费

Implement or refine UI motion, gestures, and transitions. Use when the user asks for animation, hover or press motion, drag or swipe behavior, transition timing, or reduced-motion alternatives. Mentioning a drawer, toast, or hover state alone does not request animation.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

arrange

免费

Improve layout composition, spacing systems, grouping, and visual rhythm. Use when the user mentions weak layout structure, arbitrary spacing, weak grouping, crowded composition, or layout monotony rather than priority/emphasis problems.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

audit

免费

Run technical quality checks across accessibility, performance, theming, responsive design, and anti-patterns. Generates a scored report with P0-P3 severity ratings and actionable plan. Use when the user wants measurable accessibility, performance, responsive, theming, or anti-pattern findings—not when they mainly want an overall UX critique or final visual/detail polish.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

clarify

免费

Improve UX writing, marketing copy, labels, microcopy, instructions, and error messages so interfaces and product messaging are easier to understand and act on. Use when the user mentions confusing copy, unclear labels, bad error text, weak CTAs, hard-to-follow instructions, or wanting better UX writing.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

colorize

免费

Build or refine UI color systems, warmth, semantic color, and color-based hierarchy in designs that are too gray, monochromatic, or missing color meaning. Use when the user mentions dull colors, gray UI, missing warmth, weak semantic color, or a need for stronger color hierarchy.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新

data-viz

免费

Design charts, metrics, and data tables that help users interpret and compare data. Use when the user asks to visualize data, choose chart types, improve dashboard analytics, or make data presentation accessible. Dashboard navigation and shell layout alone belong to add-ui or arrange.

中文简介正在准备中。当前显示原文说明。

aladicf/better-react-web-ui42026年9月8日 更新