Phone Input

free

Phone number input with built-in phone format validation.

Overview

The Phone Input uses native tel input type for mobile keyboard optimization and validates phone number format automatically. Accepts digits, spaces, dashes, parentheses, and the + symbol.

Properties

PropertyTypeDefaultDescription
nameString"phone"Field name used in form data.
labelString"Phone"Label displayed above the input.
placeholderString"+1 (555) 000-0000"Placeholder text.
requiredBooleanfalseWhether the field must be filled.
errorMessageString--Custom error message for invalid phone format.

Features

  • Built-in phone format validation
  • Native <input type="tel"> for phone keyboard on mobile
  • Accepts international formats (+, parentheses, dashes)
  • Browser autofill styling override

Tips

The placeholder helps users understand the expected format for your region.
For country-specific validation, use the Country component alongside this field.

Validation

This component uses phone validation. See the Validation Guide for details on configuring rules and error messages.

Related components