メニュー
Validates animation durations, enforces typography scale, checks component accessibility, and prevents layout anti-patterns in Tailwind CSS projects. Use when building UI components, reviewing CSS utilities, or enforcing design consistency.
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
Making changes to the app's functionality.
Create Criterion benchmarks with proper group macros and configuration. Use when writing benchmarks, creating benchmark groups, using criterion_group! and criterion_main! macros, setting throughput, or benchmarking multiple implementations. Handles benchmark groups, throughput metrics, conditional compilation, and proper black_box usage.
Read and parse GitHub issues; extract title, body, labels, checklists, and acceptance criteria to support triage and delegation.
Apply cognitive and perception-based UI principles from Laws of UX. Use when evaluating layout, interaction design, target size and distance, choice count, information grouping, memory load, or response time. Cites specific laws (e.g. Fitts's Law, Hick's Law) to justify design decisions or suggest improvements.
Work with async/await, futures, and asynchronous Rust code. Use when writing async functions, working with tokio or async-std, understanding futures, or implementing async traits. Handles async/await syntax, futures, executors, pinning, Send/Sync bounds, and async patterns.
Use std::hint::black_box correctly in benchmarks and tests. Use when writing benchmarks, preventing compiler optimizations, or ensuring code actually executes. Handles proper placement, when to use it, and common patterns for benchmarking.
| name | baseline-ui |
| description | Validates animation durations, enforces typography scale, checks component accessibility, and prevents layout anti-patterns in Tailwind CSS projects. Use when building UI components, reviewing CSS utilities, or enforcing design consistency. |
Enforces an opinionated UI baseline to prevent AI-generated interface slop. Framework-agnostic; applies to any stack using Tailwind CSS and semantic HTML.
/baseline-ui
Apply these constraints to any UI work in this conversation.
/baseline-ui <file>
Review the file against all constraints below and output:
@keyframes) or the project’s chosen animation approach for entrance and micro-animationsclsx + tailwind-merge, or the project’s equivalent) for conditional or merged class logicclsx (or the project’s class merge utility) to merge utility classes passed into componentsaria-label (or visible text) to icon-only buttonsh-screen, use h-dvh (or equivalent) for viewport heightsafe-area-inset for fixed elementsinput or textarea elementstransform, opacity)translate, rotate, and scale properties over the transform shorthand; they are composable and more predictably orderedwidth, height, top, left, margin, padding)background, color) except for small, local UI (text, icons)ease-out on entrance200ms for interaction feedbackprefers-reduced-motiontext-balance for headings and text-pretty for body/paragraphstabular-nums for datatruncate or line-clamp for dense UIletter-spacing (tracking-*) unless explicitly requestedz-index scale (no arbitrary z-*)size-* for square elements instead of w-* + h-*blur() or backdrop-filter surfaceswill-change outside an active animation