Jetpack Compose Otp Text Field

How to integrate into your app?

Step 1. Add the JitPack repository to your settings.gradle

dependencyResolutionManagement {
    repositories {
        //add this line
        maven { url '' }

Step 2. Add the dependency to your build.gradle

dependencies {
	implementation 'com.github.NaufalRachmandani:OtpTextField:1.0'

How to use the library?

Okay seems like you integrated the library in your project but how do you use it? Well its really easy.

  • Using Compose Just use the OtpTextField composable where you need to display the view like.
	otpText = otp,
	onOtpTextChange = onOtpChange,
	isError = false,
	textStyle = TextStyle(
	    fontWeight = FontWeight.SemiBold,
	    fontSize = 14.sp
	focusedBorderColor = neutral100,
	unFocusedBorderColor = neutral60,
	backgroundColor = Color(0xFFFFFFFF),
	focusedTextColor = neutral60,
	unFocusedTextColor = neutral100,
	focusedBorderErrorColor = primaryRed,
	unFocusedBorderErrorColor = primaryRedHover,
	backgroundErrorColor = primaryRedFocus,
	focusedTextErrorColor = neutral60,
	unFocusedTextErrorColor = neutral100,


Created by Naufal Rachmandani

  • Bug reports and pull requests are welcome.


View Github

Leave a Reply

Your email address will not be published. Required fields are marked *