A comprehensive collection of input fields with full accessibility support, validation, and RTL support. All fields follow WCAG 2.1 AA best practices.
We'll never share your email with anyone else
We'll never share your email with anyone else
Example: ahmed@company.sa
Include country code (e.g., +966 for Saudi Arabia)
Include country code (e.g., +966 for Saudi Arabia)
Example: +966501234567
Must start with http:// or https://
Must start with http:// or https://
Example: https://company.sa
16-digit card number
16-digit card number
Example: 4532015112830366
At least 8 characters with uppercase, lowercase, and numbers
At least 8 characters with uppercase, lowercase, and numbers
Press Enter to search
Press Enter to search
5-digit postal code
5-digit postal code
Example: 11564
Enter amount in Saudi Riyals
Enter amount in Saudi Riyals
Example: 2500.50
Example of how to use input fields with validation
<div className="space-y-2">
<Label htmlFor="email">Email Address</Label>
<Input
id="email"
type="email"
placeholder="your.email@example.com"
inputMode="email"
aria-describedby="email-helper"
/>
<p id="email-helper" className="text-xs text-muted-foreground">
We'll never share your email
</p>
</div>