How to Customize the Maui OTP Input Appearance

This guide provides instructions on customizing the appearance of the .NET MAUI OTP Input control using various properties such as InputBackground, Stroke, Separator , Styling Mode, Length and more.

XAML:

   <syncfusion:SfOtpInput Type="Text" Value="e3c7f4" InputBackground="AliceBlue" Stroke="DarkBlue"
                           Separator="|" StylingMode="Filled" Length="6"/>

C#:

var otpInput = new SfOtpInput
{
   Type = OtpInputType.Text,
   Value = "e3c7f4",
   InputBackground = Colors.LightBlue,
   Stroke = Colors.DarkBlue,
   Separator = "|",
   StylingMode = OtpInputStyle.Filled,
   Length = 6
}; 

Output:

You can download the complete sample from GitHub.

Conclusion

We hope you found this guide helpful in learning how to customize the .NET MAUI OTP Input . For more features, visit our .NET MAUI OTP Input feature tour page. You can also explore our .NET MAUI OTP Input documentation to understand better how to present and manipulate data.

Please let us know in the comments section below if you have any queries or need clarification. Alternatively, you can contact us by creating a support ticket. We are always happy to assist!