prompt

Form Field Error Strategy

Design error states for form fields with contextual validation messages, recovery actions, and accessibility compliance.

Updated June 2026
The prompt
Design error handling for a {{form_type}} form with {{field_count}} fields. For each error state, provide: (1) error message copy (clear, non-technical, actionable), (2) visual treatment (color, icon, border), (3) placement relative to field, (4) recovery suggestion or inline help, (5) WCAG 2.1 compliance (color contrast, ARIA live regions), (6) how errors clear (on focus, keystroke, or blur), (7) grouped error summary if multiple fields fail. Consider Arabic/English bilingual context.
Did it work? Rate this prompt

Variables

Form Type (e.g., login, registration, payment)
Number of Fields

Details

Author

AI Khazna

License

Security

Type

prompt

Related assets

More curated picks in Design & Creative.

skillclaude_appclaude_codeclaude_api
git clone https://github.com/anthropics/skills && cp -r skills/skills/canvas-design ~/.claude/skills/
Canvas Design
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece…★ 4.8 · 2,500+
skillclaude_appclaude_codeclaude_api
git clone https://github.com/anthropics/skills && cp -r skills/skills/web-artifacts-builder ~/.claude/skills/
Web Artifacts Builder
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui…★ 4.8 · 2,500+
skillclaude_appclaude_codeclaude_api
git clone https://github.com/anthropics/skills && cp -r skills/skills/slack-gif-creator ~/.claude/skills/
Slack Gif Creator
Knowledge and utilities for creating animated GIFs optimized for Slack. Provides constraints, validation tools, and animation concepts. Use when users…★ 4.8 · 2,500+
prompt
Checks color pairs against WCAG contrast rules and suggests accessible fixes.
Accessibility Contrast Checker
Checks color pairs against WCAG contrast rules and suggests accessible fixes.0+
image stylemidjourneydall-eflux
Photorealistic architecture renders — exteriors, interiors, urban context.
Architectural Render Style Pack
Photorealistic architecture renders — exteriors, interiors, urban context.0+
prompt
Adapts a light-mode color palette to an accessible dark-mode palette with surface and text tokens.
Dark Mode Palette Adapter
Adapts a light-mode color palette to an accessible dark-mode palette with surface and text tokens.0+

Audit before you install

Run any source through our checks - AI visibility, security, performance, and stack detection.

More in Design & Creative