better-forms
✓最新のスタック (React/Next.js、Tailwind、Zod) でアクセス可能な高 UX フォームを構築するための完全なガイド。クリック可能な領域、範囲スライダー、出力にインスピレーションを受けたデザイン、および WCAG 準拠の特定のパターンが含まれています。
インストール
SKILL.md
A collection of specific UX patterns, accessibility standards, and implementation techniques for modern web forms. This guide bridges the gap between raw HTML/CSS tips and component-based architectures (React, Tailwind, Headless UI).
Concept: Small gaps between clickable list items create frustration. Implementation (Tailwind): Use a pseudo-element to expand the hit area without affecting layout.
Concept: "From $10 to $1000" text inputs are tedious. Implementation: Use a dual-thumb slider component (like Radix UI / Shadcn Slider) for ranges.
最新のスタック (React/Next.js、Tailwind、Zod) でアクセス可能な高 UX フォームを構築するための完全なガイド。クリック可能な領域、範囲スライダー、出力にインスピレーションを受けたデザイン、および WCAG 準拠の特定のパターンが含まれています。 ソース: alexeira/skills。
引用可能な情報
AI/検索での引用用の安定したフィールドとコマンド。
- インストールコマンド
npx skills add https://github.com/alexeira/skills --skill better-forms- カテゴリ
- *クリエイティブ
- 認証済み
- ✓
- 初回登録
- 2026-02-17
- 更新日
- 2026-02-18
クイックアンサー
better-forms とは?
最新のスタック (React/Next.js、Tailwind、Zod) でアクセス可能な高 UX フォームを構築するための完全なガイド。クリック可能な領域、範囲スライダー、出力にインスピレーションを受けたデザイン、および WCAG 準拠の特定のパターンが含まれています。 ソース: alexeira/skills。
better-forms のインストール方法は?
ターミナルまたはコマンドラインツール(Terminal、iTerm、Windows Terminal など)を開きます このコマンドをコピーして実行します: npx skills add https://github.com/alexeira/skills --skill better-forms インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります
ソースリポジトリはどこですか?
https://github.com/alexeira/skills
詳細
- カテゴリ
- *クリエイティブ
- ソース
- skills.sh
- 初回登録
- 2026-02-17